.tool-panel.practice-tool-panel{max-width:none}
.practice-tool-layout{display:grid;grid-template-columns:280px minmax(0,1fr);gap:24px;align-items:start}
.practice-tool-form,.practice-tool-output{min-width:0}
.practice-tool-form label{display:grid;gap:6px;margin:12px 0;font-weight:700;font-size:13px;color:var(--muted)}
.practice-tool-form textarea,.practice-tool-form select{box-sizing:border-box;width:100%;min-height:44px;padding:10px;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--text);font:inherit;font-size:16px}
.practice-tool-form textarea{min-height:100px;resize:vertical}
.practice-tool-panel button{min-height:44px}
.practice-tool-actions,.finder-notes{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.practice-tool-message{min-height:22px;margin:10px 0;color:var(--accent);font-size:14px}
.practice-tool-diagrams{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}
.practice-tool-diagram{min-width:0;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--surface-2)}
.practice-tool-diagram h3{margin:4px 0 8px;color:var(--accent);font-size:24px}
.practice-tool-diagram p{font-size:13px;color:var(--muted);margin:6px 0}
.practice-tool-diagram .fretboard{display:block;width:min(160px,100%);height:auto;margin:8px auto}
.practice-tool-heading{font-size:22px;margin:0 0 10px}
.finder-notes button{min-width:52px;border:1px solid var(--line);border-radius:10px;background:var(--surface-2);color:var(--text);font:700 15px inherit;padding:8px}
.finder-notes button[aria-pressed="true"]{border-color:var(--accent-2);background:var(--accent-2);color:#04121a}
.finder-results{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}
.reference-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-width:900px}
.reference-grid button{display:grid;gap:5px;min-height:100px;padding:14px;border:1px solid var(--line);border-radius:12px;background:var(--surface-2);color:var(--text);font:inherit;text-align:left}
.reference-grid button strong{font-size:25px;color:var(--accent)}
.reference-grid button small{color:var(--muted)}
.reference-grid button[aria-pressed="true"]{border-color:var(--accent-2);box-shadow:inset 0 0 0 1px var(--accent-2)}
.reference-volume{width:100%;height:44px;accent-color:var(--accent-2)}
.practice-tool-panel button:focus-visible,.practice-tool-panel select:focus-visible,.practice-tool-panel textarea:focus-visible,.practice-tool-panel input:focus-visible{outline:3px solid var(--accent-2);outline-offset:2px}
@media(max-width:759px){.practice-tool-layout{grid-template-columns:minmax(0,1fr)}.reference-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.practice-tool-diagrams,.finder-results{grid-template-columns:repeat(auto-fit,minmax(125px,1fr))}}
