.tools-page[data-tool=transpose-tool]{--tools-area-min-height:640px}.tr-tone-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;display:grid}.tr-tone-grid button{border:1.5px solid var(--border);min-height:40px;color:var(--navy);font:800 14px var(--font-body);cursor:pointer;background:#fff;border-radius:12px;padding:0 2px}.tr-tone-grid button[aria-pressed=true]{border-color:var(--primary);background:var(--primary);color:#fff}.tr-main{align-content:start}.tr-keys{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:16px;display:grid}.tr-key{border:1.5px solid var(--border);border-radius:20px;justify-items:center;gap:2px;padding:14px;display:grid}.tr-key small{color:var(--text-muted);letter-spacing:.12em;text-transform:uppercase;font-size:12.5px;font-weight:800}.tr-key b{color:var(--navy);font:800 64px / 1 var(--font-display)}.tr-key.is-target{border-color:var(--primary);background:var(--primary)}.tr-key.is-target small{color:var(--blue-tint)}.tr-key.is-target b{color:#fff}.tr-swap{background:var(--blue-wash);width:52px;height:52px;color:var(--primary);cursor:pointer;border:0;border-radius:50%;place-items:center;display:grid}.tr-swap svg{width:24px;height:24px}.tr-step{justify-content:center;align-items:center;gap:16px;display:flex}.tr-step .tools-round{background:var(--bg-light)}.tr-step p{color:var(--text-body);font-size:15.5px}.tr-step p b{color:var(--primary);font:800 24px var(--font-display);margin-right:6px}.tr-panes{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:14px;display:grid}.tr-pane{align-content:start;gap:8px;min-width:0;display:grid}.tr-pane textarea,.tr-phone-sheet textarea{border:1.5px solid var(--line-strong);width:100%;min-height:190px;color:var(--navy);resize:vertical;border-radius:16px;padding:12px 14px;font:700 16px/1.7 ui-monospace,SFMono-Regular,Menlo,monospace}.tr-pane textarea:focus,.tr-phone-sheet textarea:focus{border-color:var(--primary);box-shadow:0 0 0 4px var(--blue-wash);outline:none}.tr-tools{gap:14px;display:flex}.tr-result{white-space:pre;background:var(--bg-light);border-radius:16px;max-width:100%;min-height:190px;padding:12px;font:700 16px/1.7 ui-monospace,SFMono-Regular,Menlo,monospace;overflow-x:auto}.tr-line,.tr-chip{display:inline}.tr-chip b{color:var(--navy);font:inherit}.tr-word{color:var(--text-body);font:inherit}.tr-capo-seg{grid-template-columns:repeat(4,minmax(0,1fr));display:grid}.tr-capo-note{color:var(--text-body);font-size:15px}.tr-map{grid-template-columns:1fr 1fr;gap:6px;margin:0;padding:0;list-style:none;display:grid}.tr-map li{background:var(--bg-light);font:800 15px var(--font-display);border-radius:12px;align-items:center;gap:6px;padding:8px 10px;display:flex}.tr-map li span{color:var(--text-muted)}.tr-map li b{color:var(--primary)}.tr-map li.is-empty{color:var(--text-muted);font:600 14px var(--font-body);grid-column:1/-1}.tr-phone-keys{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:10px;display:grid}.tr-phone-key{color:#fff;border:1.5px solid #fff6;border-radius:20px;justify-items:center;padding:12px 8px;display:grid;position:relative}.tr-phone-key small{color:var(--blue-tint);letter-spacing:.1em;text-transform:uppercase;font-size:11.5px;font-weight:800}.tr-phone-key b{font:800 48px / 1.1 var(--font-display)}.tr-phone-key.is-target{color:var(--primary);background:#fff}.tr-phone-key.is-target small{color:var(--text-muted)}.tr-phone-key select{opacity:0;cursor:pointer;width:100%;height:100%;position:absolute;inset:0}.tr-swap.is-phone{color:#fff;background:#ffffff2e}.tr-step.is-phone{color:#fff}.tr-step.is-phone p{color:#fff;font-size:14px}.tr-step.is-phone p b{color:var(--sun)}.tr-phone-result{text-align:left;justify-items:stretch;gap:8px}.tr-phone-sheet{gap:8px;display:grid}.tr-phone-sheet summary{min-height:44px;color:var(--primary);font:800 15px var(--font-body);cursor:pointer;align-items:center;display:flex}.tr-phone-sheet textarea{min-height:130px}