body[data-page=transposer]{--transposer-panel:#24271f;--transposer-panel-deep:#1c2119;--transposer-panel-soft:#2a2f23;--transposer-border:#535b45;--transposer-border-soft:#41483a;--transposer-text-soft:#c0c6b4}body[data-page=transposer] .transposer-heading{margin-bottom:6px}body[data-page=transposer] .transposer-heading>p{max-width:430px;color:var(--color-muted)}body[data-page=transposer] .transposer-lead{max-width:42rem;color:var(--color-text);margin:10px 0 0;font-size:16px;line-height:1.5}body[data-page=transposer] .transposer-tool{background:var(--transposer-panel);border:1px solid var(--transposer-border);box-shadow:var(--shadow-lg);border-radius:5px;overflow:hidden}body[data-page=transposer] .transposer-card{grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);display:grid}body[data-page=transposer] .transposer-panel{min-width:0;padding:25px 28px 26px}body[data-page=transposer] .transposer-input-panel{border-right:1px solid var(--transposer-border);background:linear-gradient(135deg,#2a2e23,#24271f 70%)}body[data-page=transposer] .transposer-output-panel{background:var(--transposer-panel-deep)}body[data-page=transposer] .transposer-panel-heading,body[data-page=transposer] .transposer-subheading-row{justify-content:space-between;align-items:flex-start;gap:15px;display:flex}body[data-page=transposer] .transposer-panel-heading{min-height:49px;margin-bottom:18px}body[data-page=transposer] .transposer-panel h2,body[data-page=transposer] .transposer-panel h3{color:var(--color-text);letter-spacing:-.25px;margin:4px 0 0;font-family:Studio Display,sans-serif;font-weight:600}body[data-page=transposer] .transposer-panel h2{font-size:25px}body[data-page=transposer] .transposer-panel h3{font-size:20px}body[data-page=transposer] .transposer-panel .eyebrow{margin-bottom:4px}body[data-page=transposer] .transposer-panel-actions,body[data-page=transposer] .transposer-output-actions,body[data-page=transposer] .transposer-play-actions{flex-wrap:wrap;align-items:center;gap:8px;display:flex}body[data-page=transposer] .transposer-panel-actions{justify-content:flex-end}body[data-page=transposer] button.transposer-quiet-button,body[data-page=transposer] button.transposer-secondary-button,body[data-page=transposer] button.transposer-step-button,body[data-page=transposer] button.transposer-primary-button{border-radius:3px;min-height:40px;font-size:12px}body[data-page=transposer] .transposer-quiet-button{color:var(--color-primary);background:0 0;border-color:#0000;padding:8px 10px}body[data-page=transposer] .transposer-quiet-button:hover{background:#3a3f2f;text-decoration:underline}body[data-page=transposer] .transposer-field-label{color:var(--transposer-text-soft);letter-spacing:.25px;margin-bottom:8px;font-size:11px;font-weight:600;display:block}body[data-page=transposer] #chord-input{resize:vertical;width:100%;min-height:132px;color:var(--color-text);tab-size:4;letter-spacing:.15px;background:#1a1e17;border:1px solid #646b54;border-radius:3px;padding:14px 15px;font-family:SFMono-Regular,Consolas,Liberation Mono,monospace;font-size:17px;line-height:1.6;display:block}body[data-page=transposer] #chord-input::placeholder{color:#89907e}body[data-page=transposer] #chord-input:focus-visible,body[data-page=transposer] input:focus-visible,body[data-page=transposer] select:focus-visible,body[data-page=transposer] button:focus-visible,body[data-page=transposer] summary:focus-visible{outline-offset:3px;outline:3px solid #c17a42}body[data-page=transposer] .transposer-help-text,body[data-page=transposer] .transposer-limit-note,body[data-page=transposer] .transposer-key-status,body[data-page=transposer] .transposer-rhythm>p,body[data-page=transposer] .transposer-capo-panel>p{color:var(--color-muted);margin:8px 0 0;font-size:12px;line-height:1.55}body[data-page=transposer] .transposer-mode-note{color:#a9b09a;margin:5px 0 0;font-size:11px;line-height:1.45}body[data-page=transposer] .transposer-help-text code,body[data-page=transposer] .transposer-example-note code,body[data-page=transposer] .transposer-info-grid code,body[data-page=transposer] .transposer-help-section>p code,body[data-page=transposer] details code{color:var(--color-text);font-family:Courier New,monospace}body[data-page=transposer] .transposer-limit-note{color:#c9a979;letter-spacing:.2px;margin-top:6px;font-family:Courier New,monospace;font-size:10px}body[data-page=transposer] .transposer-key-controls,body[data-page=transposer] .transposer-shift{border-top:1px solid var(--transposer-border-soft);margin-top:21px;padding-top:19px}body[data-page=transposer] .transposer-key-controls .transposer-subheading-row,body[data-page=transposer] .transposer-shift .transposer-subheading-row{align-items:center}body[data-page=transposer] .transposer-key-grid{grid-template-columns:minmax(0,1fr) minmax(94px,.7fr) minmax(0,1fr);gap:10px;margin-top:15px;display:grid}body[data-page=transposer] .transposer-key-grid label,body[data-page=transposer] .transposer-rhythm-grid label{min-width:0;color:var(--transposer-text-soft);font-size:10px;line-height:1.2}body[data-page=transposer] .transposer-key-grid select,body[data-page=transposer] .transposer-rhythm-grid select,body[data-page=transposer] .transposer-rhythm-grid input,body[data-page=transposer] .transposer-spelling-label select,body[data-page=transposer] .transposer-select-label select{width:100%;min-width:0;min-height:42px;color:var(--color-text);background-color:#1b2018;border-color:#5b624e;border-radius:3px;margin-top:7px;font-size:13px}body[data-page=transposer] .transposer-key-status{color:#c6b28e;min-height:19px}body[data-page=transposer] .transposer-live-note{color:#9da58d;letter-spacing:.2px;font-family:Courier New,monospace;font-size:10px}body[data-page=transposer] .transposer-shift-controls{grid-template-columns:minmax(0,1fr) 118px minmax(0,1fr);align-items:end;gap:8px;margin-top:15px;display:grid}body[data-page=transposer] .transposer-step-button{border-color:var(--transposer-border);color:var(--color-text);background:#303628}body[data-page=transposer] .transposer-step-button:hover{background:#3b4432}body[data-page=transposer] .transposer-select-label,body[data-page=transposer] .transposer-spelling-label{min-width:0;color:var(--transposer-text-soft);font-size:10px;font-weight:600;display:block}body[data-page=transposer] .transposer-output-panel .transposer-panel-heading{align-items:end}body[data-page=transposer] .transposer-output-settings{align-items:end;gap:10px;display:flex}body[data-page=transposer] .transposer-spelling-label{flex:0 128px;width:128px}body[data-page=transposer] .transposer-capo-control{width:118px;color:var(--transposer-text-soft);flex:0 118px;font-size:10px;font-weight:600}body[data-page=transposer] .transposer-capo-control select{width:100%;min-width:0;min-height:42px;color:var(--color-text);background-color:#1b2018;border-color:#5b624e;border-radius:3px;margin-top:7px;font-size:13px}body[data-page=transposer] #transposed-output,body[data-page=transposer] #capo-output{color:#f1d19c;white-space:pre-wrap;overflow-wrap:anywhere;background:#141912;border:1px solid #5c654d;border-radius:3px;min-height:143px;margin:0;padding:17px 18px;font-family:Courier New,monospace;font-size:17px;line-height:1.75;overflow:auto}body[data-page=transposer] .transposer-summary{min-height:21px;color:var(--transposer-text-soft);margin:10px 0 0;font-size:12px;line-height:1.45}body[data-page=transposer] .transposer-result-note{color:#9ba38f;margin:8px 0 0;font-size:10px;line-height:1.45}body[data-page=transposer] .transposer-error{color:#ffb199;min-height:20px;margin:8px 0 0;font-size:12px;line-height:1.45}body[data-page=transposer] .transposer-output-actions{margin-top:16px}body[data-page=transposer] .transposer-primary-button{border-color:var(--color-primary);background:var(--color-primary);color:#24271f}body[data-page=transposer] .transposer-primary-button:hover{background:#f4c78b}body[data-page=transposer] .transposer-secondary-button{border-color:var(--transposer-border);color:var(--color-text);background:#2b3025}body[data-page=transposer] .transposer-secondary-button:hover{background:#3b4432}body[data-page=transposer] button:disabled,body[data-page=transposer] select:disabled,body[data-page=transposer] input:disabled{cursor:not-allowed;opacity:.48}body[data-page=transposer] .transposer-diagrams{grid-template-columns:repeat(auto-fit,minmax(125px,1fr));gap:9px;min-height:44px;margin-top:16px;display:grid}body[data-page=transposer] .transposer-diagrams-empty{color:var(--color-muted);border:1px dashed #4e5843;grid-column:1/-1;margin:0;padding:12px 14px;font-size:11px;line-height:1.5}body[data-page=transposer] .transposer-diagram-card{background:#252c20;border:1px solid #4d5842;border-radius:3px;min-width:0;padding:11px 10px}body[data-page=transposer] .transposer-diagram-card h3{margin:0 0 8px;font-family:Courier New,monospace;font-size:15px;font-weight:600}body[data-page=transposer] .transposer-diagram-card p{color:var(--color-muted);margin:0;font-size:10px;line-height:1.45}body[data-page=transposer] figure.transposer-diagram{color:#151713;background:#fff;border:1px solid #4d5842;border-radius:3px;min-width:0;margin:0;padding:15px 14px 14px}body[data-page=transposer] figure.transposer-diagram figcaption{color:#151713;overflow-wrap:anywhere;margin-top:10px;padding:0 1px;font-family:Courier New,monospace;font-size:15px;font-weight:600;line-height:1.35}body[data-page=transposer] figure.transposer-diagram svg,body[data-page=transposer] figure.transposer-diagram .chord-diagram{width:100%;height:auto;max-height:210px;display:block}body[data-page=transposer] .transposer-diagram-missing{color:#252b22;text-align:center;background:#f5f4ef;border:1px dashed #697056;place-items:center;min-height:90px;padding:12px;font-size:12px;line-height:1.45;display:grid}body[data-page=transposer] figure.transposer-diagram>p{color:#252b22;background:#f5f4ef;border:1px dashed #697056;margin:9px 0 0;padding:10px 8px;font-size:12px;line-height:1.45}body[data-page=transposer] .transposer-capo-panel{background:#252b20;border:1px solid #59634b;border-radius:3px;margin-top:16px;padding:14px}body[data-page=transposer] .transposer-capo-panel .transposer-subheading-row{align-items:center}body[data-page=transposer] .transposer-capo-panel h3{font-size:18px}body[data-page=transposer] #capo-output{background:#1b2118;min-height:0;margin-top:12px;padding:10px 12px;font-size:14px}body[data-page=transposer] .transposer-rhythm{border:1px solid var(--transposer-border-soft);border-radius:3px;margin:18px 0 0;padding:13px 14px 14px}body[data-page=transposer] .transposer-rhythm legend{color:#cbb383;letter-spacing:.4px;text-transform:uppercase;padding:0 7px;font-family:Courier New,monospace;font-size:10px}body[data-page=transposer] .transposer-rhythm-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}body[data-page=transposer] .transposer-rhythm-grid input{appearance:textfield}body[data-page=transposer] .transposer-rhythm-grid input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}body[data-page=transposer] .transposer-rhythm-grid input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}body[data-page=transposer] .transposer-field-hint{color:#8c9682;font-weight:400}body[data-page=transposer] .transposer-play-actions{margin-top:16px}body[data-page=transposer] .transposer-action-status{color:#cbb383;min-height:20px;margin:8px 0 0;font-size:12px;line-height:1.45}body[data-page=transposer] .transposer-privacy-note{border-top:1px solid var(--transposer-border-soft);color:#9ba38f;margin:0;padding:11px 28px 13px;font-size:11px}body[data-page=transposer] .transposer-rule-note{color:#cbb383;margin:0;padding:0 28px 16px;font-family:Courier New,monospace;font-size:10px;line-height:1.55}body[data-page=transposer] .transposer-help-section{max-width:920px;margin-top:42px}body[data-page=transposer] .transposer-help-section>h2{margin-top:29px}body[data-page=transposer] .transposer-help-section>h2:first-child{margin-top:0}body[data-page=transposer] .transposer-help-section>p{max-width:880px}body[data-page=transposer] .transposer-info-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:18px 0 10px;display:grid}body[data-page=transposer] .transposer-info-grid article{background:#242a20;border:1px solid #454d3d;border-radius:3px;padding:16px 17px}body[data-page=transposer] .transposer-info-grid h3{color:var(--color-text);margin:0 0 8px;font-family:Studio Display,sans-serif;font-size:19px;font-weight:600}body[data-page=transposer] .transposer-info-grid p{margin:0;font-size:13px}body[data-page=transposer] .transposer-example-note{border-left:2px solid var(--color-primary);background:#262b21;padding:12px 14px}body[data-page=transposer] .transposer-lyric-example{background:#242a20;border-left:2px solid #858e70;padding:11px 14px}body[data-page=transposer] .transposer-lyric-example code{color:var(--color-text);font-family:Courier New,monospace}body[data-page=transposer] .transposer-help-section details{border-top:1px solid #3e4637;padding:12px 0}body[data-page=transposer] .transposer-help-section details:last-of-type{border-bottom:1px solid #3e4637}body[data-page=transposer] .transposer-help-section summary{cursor:pointer;color:var(--color-text);font-size:14px;font-weight:600}body[data-page=transposer] .transposer-help-section details p{max-width:820px;margin:9px 0 0;font-size:13px}body[data-page=transposer] .visually-hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}body[data-page=transposer] #transposer-print-sheet{display:none}@media print{@page{margin:14mm}body[data-page=transposer]{color:#151713;background:#fff}body[data-page=transposer]>*{display:none!important}body[data-page=transposer]>#transposer-print-sheet{color:#151713;max-width:100%;font-family:Arial,sans-serif;display:block!important}body[data-page=transposer]>#transposer-print-sheet h1{margin:0 0 5mm;font-size:24pt}body[data-page=transposer]>#transposer-print-sheet p{margin:0 0 4mm;font-size:10pt;line-height:1.45}body[data-page=transposer]>#transposer-print-sheet pre{white-space:pre-wrap;overflow-wrap:anywhere;color:#151713;border:1px solid #b7b9b1;max-width:100%;margin:0 0 6mm;padding:4mm;font:11pt/1.55 Courier New,monospace}body[data-page=transposer]>#transposer-print-sheet .transposer-print-diagrams{grid-template-columns:repeat(3,minmax(0,1fr));gap:5mm;display:grid}body[data-page=transposer]>#transposer-print-sheet figure.transposer-diagram,body[data-page=transposer]>#transposer-print-sheet .transposer-diagram{break-inside:avoid;page-break-inside:avoid;color:#151713;background:#fff;border:1px solid #b7b9b1;margin:0;padding:3mm}body[data-page=transposer]>#transposer-print-sheet figure.transposer-diagram figcaption{color:#151713;font-size:8pt}body[data-page=transposer]>#transposer-print-sheet svg,body[data-page=transposer]>#transposer-print-sheet .chord-diagram{max-height:55mm}}@media (width<=920px){body[data-page=transposer] .transposer-card{flex-direction:column;gap:0;display:flex}body[data-page=transposer] .transposer-input-panel,body[data-page=transposer] .transposer-output-panel{display:contents}body[data-page=transposer] .transposer-card>.transposer-input-panel>.transposer-panel-heading{order:1;width:100%;margin:0;padding:20px 16px 0}body[data-page=transposer] .transposer-card>.transposer-input-panel>.transposer-field-label{order:2;width:calc(100% - 32px);margin:14px 16px 8px}body[data-page=transposer] .transposer-card>.transposer-input-panel>#chord-input{order:3;width:calc(100% - 32px);min-height:108px;margin:0 16px}body[data-page=transposer] .transposer-card>.transposer-input-panel>#input-format{order:4;width:calc(100% - 32px);margin:8px 16px 0}body[data-page=transposer] .transposer-card>.transposer-input-panel>#input-limits{order:5;width:calc(100% - 32px);margin:6px 16px 0}body[data-page=transposer] .transposer-card>.transposer-input-panel>.transposer-shift{order:6;width:calc(100% - 32px);margin:18px 16px 0;padding-top:16px}body[data-page=transposer] .transposer-card>.transposer-output-panel>.transposer-panel-heading{border-top:1px solid var(--transposer-border);order:7;width:100%;margin:18px 0 0;padding:18px 16px 14px}body[data-page=transposer] .transposer-card>.transposer-output-panel>#transposed-output{order:8;width:calc(100% - 32px);margin:0 16px}body[data-page=transposer] .transposer-card>.transposer-output-panel>.transposer-result-note{order:9;width:calc(100% - 32px);margin:8px 16px 0}body[data-page=transposer] .transposer-card>.transposer-output-panel>.transposer-summary{order:10;width:calc(100% - 32px);margin:8px 16px 0}body[data-page=transposer] .transposer-card>.transposer-output-panel>.transposer-error{order:11;width:calc(100% - 32px);margin:8px 16px 0}body[data-page=transposer] .transposer-card>.transposer-output-panel>.transposer-output-actions{order:12;width:calc(100% - 32px);margin:14px 16px 0}body[data-page=transposer] .transposer-card>.transposer-input-panel>.transposer-key-controls{order:13;width:calc(100% - 32px);margin:18px 16px 0;padding-top:16px}body[data-page=transposer] .transposer-card>.transposer-output-panel>.transposer-capo-panel{order:14;width:calc(100% - 32px);margin:16px 16px 0}body[data-page=transposer] .transposer-card>.transposer-output-panel>.transposer-diagrams{order:15;width:calc(100% - 32px);margin:16px 16px 0}body[data-page=transposer] .transposer-card>.transposer-output-panel>.transposer-rhythm{order:16;width:calc(100% - 32px);margin:18px 16px 0}body[data-page=transposer] .transposer-card>.transposer-output-panel>.transposer-play-actions{order:17;width:calc(100% - 32px);margin:16px 16px 0}body[data-page=transposer] .transposer-card>.transposer-output-panel>.transposer-action-status{order:18;width:calc(100% - 32px);margin:8px 16px 0;padding-bottom:20px}body[data-page=transposer] .transposer-input-panel,body[data-page=transposer] .transposer-output-panel{border:0}}@media (width<=600px){body[data-page=transposer] .transposer-panel{padding:20px 16px 21px}body[data-page=transposer] .transposer-panel-heading{flex-direction:column;align-items:flex-start;gap:8px;margin-bottom:14px}body[data-page=transposer] .transposer-card>.transposer-input-panel>.transposer-panel-heading{margin:0;padding:18px 16px 0}body[data-page=transposer] .transposer-card>.transposer-output-panel>.transposer-panel-heading{align-items:flex-start;margin:14px 0 0;padding:16px 16px 12px}body[data-page=transposer] .transposer-panel-actions{justify-content:flex-start}body[data-page=transposer] .transposer-key-controls .transposer-subheading-row,body[data-page=transposer] .transposer-shift .transposer-subheading-row,body[data-page=transposer] .transposer-capo-panel .transposer-subheading-row{flex-direction:column;align-items:flex-start;gap:5px}body[data-page=transposer] .transposer-key-grid{grid-template-columns:repeat(2,minmax(0,1fr))}body[data-page=transposer] .transposer-key-grid label:last-child{grid-column:1/-1}body[data-page=transposer] .transposer-shift-controls{grid-template-columns:minmax(0,1fr) minmax(86px,.8fr)}body[data-page=transposer] .transposer-shift-controls #shift-up{grid-column:1/-1}body[data-page=transposer] .transposer-spelling-label{flex:1 1 0;width:auto}body[data-page=transposer] .transposer-output-settings{align-items:end;width:100%}body[data-page=transposer] .transposer-capo-control{flex:1 1 0;width:auto}body[data-page=transposer] .transposer-output-actions,body[data-page=transposer] .transposer-play-actions{align-items:stretch}body[data-page=transposer] .transposer-output-actions button,body[data-page=transposer] .transposer-play-actions button{flex:calc(50% - 8px)}body[data-page=transposer] .transposer-privacy-note{padding:11px 16px 13px}body[data-page=transposer] .transposer-rule-note{padding:0 16px 15px}body[data-page=transposer] .transposer-help-section{margin-top:30px}body[data-page=transposer] .transposer-info-grid{grid-template-columns:minmax(0,1fr)}}@media (width<=390px){body[data-page=transposer] .transposer-panel h2{font-size:23px}body[data-page=transposer] #transposed-output{font-size:15px}body[data-page=transposer] .transposer-output-actions button,body[data-page=transposer] .transposer-play-actions button{flex-basis:100%}}@media (prefers-reduced-motion:reduce){body[data-page=transposer] *{scroll-behavior:auto!important}}