.page.svelte-nh684h{background-color:var(--color-surface-canvas);--root-c:#e11d48;--iv-1:#fb923c;--iv-2:#f59e0b;--iv-3:#facc15;--iv-4:#a3e635;--iv-5:#4ade80;--iv-6:#2dd4bf;--iv-7:#38bdf8;--iv-8:#60a5fa;--iv-9:#818cf8;--iv-10:#c084fc;--iv-11:#f472b6;min-height:calc(100vh - 4.5rem - 130px);margin:-1em;padding:1em}.page-inner.svelte-nh684h{max-width:1200px;margin:0 auto;padding:2.5rem 1rem 3rem}.page-header.svelte-nh684h{text-align:center;margin-bottom:2rem}.page-title.svelte-nh684h{background:linear-gradient(135deg, var(--color-title-from) 0%, var(--color-title-to) 100%);color:#0000;-webkit-background-clip:text;background-clip:text;margin-bottom:.5rem;font-size:2.2rem;font-weight:800}.page-subtitle.svelte-nh684h{color:var(--color-text-secondary);max-width:620px;margin:0 auto;font-size:1.05rem}.glass-card.svelte-nh684h{background:color-mix(in srgb, var(--color-surface-raised) 45%, transparent);border:1px solid var(--color-border-subtle);-webkit-backdrop-filter:blur(16px);border-radius:20px;box-shadow:0 10px 30px -10px #0000004d}.controls-card.svelte-nh684h{margin-bottom:1.5rem;padding:1.5rem 1.75rem}.board-card.svelte-nh684h{margin-bottom:1.5rem;padding:2rem}.legend-card.svelte-nh684h{padding:1.5rem 1.75rem}.control-label.svelte-nh684h{letter-spacing:.5px;text-transform:uppercase;color:var(--color-text-muted);margin-bottom:.75rem;font-size:.8rem;font-weight:700}.key-row.svelte-nh684h{flex-wrap:wrap;gap:.5rem;display:flex}.key-btn.svelte-nh684h{float:none;border:1px solid var(--color-border-strong);background:color-mix(in srgb, var(--color-surface-canvas) 55%, transparent);width:auto;min-width:3rem;height:auto;color:var(--color-text-secondary);cursor:pointer;border-radius:10px;margin:0;padding:.5rem .6rem;font-size:.9rem;font-weight:700;transition:background .15s,color .15s,border-color .15s,transform .15s}.key-btn.svelte-nh684h:hover{color:var(--color-text-primary);border-color:color-mix(in srgb, var(--color-accent) 45%, transparent);transform:translateY(-1px)}.key-btn.active.svelte-nh684h{color:#fff;background:linear-gradient(135deg,#fb7185 0%,#e11d48 100%);border-color:#fff;box-shadow:0 4px 14px #e11d4873}.controls-bottom.svelte-nh684h{border-top:1px solid var(--color-border-subtle);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;margin-top:1.25rem;padding-top:1.25rem;display:flex}.hint.svelte-nh684h{color:var(--color-text-secondary);margin:0;font-size:.92rem}.hint.svelte-nh684h i:where(.svelte-nh684h){color:var(--color-accent);margin-right:.35rem}.hint.svelte-nh684h strong{color:var(--color-text-primary)}.control-actions.svelte-nh684h{flex-wrap:wrap;align-items:center;gap:1rem;display:flex}.switch-label.svelte-nh684h{color:var(--color-text-secondary);cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:.55rem;font-size:.9rem;display:inline-flex}.switch.svelte-nh684h{width:2.4rem;height:1.3rem;display:inline-block;position:relative}.switch.svelte-nh684h input:where(.svelte-nh684h){z-index:1;opacity:0;cursor:pointer;margin:0;position:absolute;inset:0}.slider.svelte-nh684h{background-color:var(--color-surface-overlay);border-radius:34px;transition:all .3s;position:absolute;inset:0}.slider.svelte-nh684h:before{content:"";background-color:#fff;border-radius:50%;width:.95rem;height:.95rem;transition:all .3s;position:absolute;bottom:.17rem;left:.18rem}.switch.svelte-nh684h input:where(.svelte-nh684h):checked+.slider:where(.svelte-nh684h){background-color:var(--color-accent)}.switch.svelte-nh684h input:where(.svelte-nh684h):checked+.slider:where(.svelte-nh684h):before{transform:translate(1.1rem)}.ghost-btn.svelte-nh684h{float:none;border:1px solid var(--color-border-strong);width:auto;height:auto;color:var(--color-text-secondary);cursor:pointer;background:0 0;border-radius:10px;align-items:center;gap:.4rem;margin:0;padding:.5rem .9rem;font-size:.85rem;font-weight:600;transition:background .15s,color .15s,border-color .15s;display:inline-flex}.ghost-btn.svelte-nh684h:hover:not(:disabled){color:var(--color-text-primary);border-color:color-mix(in srgb, var(--color-accent) 45%, transparent);background:color-mix(in srgb, var(--color-accent) 12%, transparent)}.ghost-btn.svelte-nh684h:disabled{opacity:.45;cursor:default}.legend.svelte-nh684h{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.6rem 1rem;margin:0;padding:0;list-style:none;display:grid}.legend-item.svelte-nh684h{align-items:center;gap:.6rem;display:flex}.legend-swatch.svelte-nh684h{color:#fff;text-shadow:0 1px 2px #0009;border:2px solid #ffffffd9;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:1.9rem;height:1.9rem;font-size:.78rem;font-weight:800;display:inline-flex;box-shadow:0 0 10px #00000059}.legend-name.svelte-nh684h{color:var(--color-text-secondary);font-size:.88rem}@media (width<=600px){.controls-card.svelte-nh684h,.legend-card.svelte-nh684h,.board-card.svelte-nh684h{padding:1.25rem}.key-btn.svelte-nh684h{min-width:2.6rem;padding:.45rem .4rem;font-size:.85rem}}.fretboard-container.dark-theme .note.clicked[class*=iv-]{border-color:#fff;box-shadow:0 0 12px #0006,inset 0 2px 4px #ffffff59}.fretboard-container.dark-theme .note.clicked.iv-1{background:var(--iv-1)}.fretboard-container.dark-theme .note.clicked.iv-2{background:var(--iv-2)}.fretboard-container.dark-theme .note.clicked.iv-3{background:var(--iv-3)}.fretboard-container.dark-theme .note.clicked.iv-4{background:var(--iv-4)}.fretboard-container.dark-theme .note.clicked.iv-5{background:var(--iv-5)}.fretboard-container.dark-theme .note.clicked.iv-6{background:var(--iv-6)}.fretboard-container.dark-theme .note.clicked.iv-7{background:var(--iv-7)}.fretboard-container.dark-theme .note.clicked.iv-8{background:var(--iv-8)}.fretboard-container.dark-theme .note.clicked.iv-9{background:var(--iv-9)}.fretboard-container.dark-theme .note.clicked.iv-10{background:var(--iv-10)}.fretboard-container.dark-theme .note.clicked.iv-11{background:var(--iv-11)}