@font-face{font-family:Anton;src:url(./Anton-Regular-DcVcLnRJ.ttf)format("truetype");font-display:swap}:root{--ink:#000;--warm:#1d2111;--mid:#2b3019;--paper:#f4efe6;--cream:#e8e0d0;--muted:#a09282;--brass:#b8923a;--brass-light:#d4aa55;--line:#b8923a47;--focus:#fff;--bold:"Anton", Impact, "Arial Narrow", sans-serif;--sans:system-ui, -apple-system, "Segoe UI", sans-serif}*{box-sizing:border-box;margin:0}html,body,#root,.sizer,.scaled{height:100%}body{background:var(--ink);color:var(--paper);font-family:var(--sans)}.visually-hidden{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}button,select{font:inherit;color:inherit}select option{font-family:var(--sans);color:var(--paper);background:var(--warm);font-size:1rem;font-weight:400}button{cursor:pointer}button:focus-visible,select:focus-visible{outline:.19em solid var(--focus);outline-offset:.12em}.app{flex-direction:column;height:100%;display:flex}.head{border-bottom:.0625em solid var(--line);justify-content:center;align-items:stretch;gap:2em;padding:.6em 1em .9em;display:flex}.info{flex-direction:column;align-self:flex-start;align-items:flex-start;gap:.7em;min-width:0;display:flex}.bar-rows{flex-direction:column;gap:.5em;font-size:.85em;display:flex}.head-wheel{width:calc(var(--wheel) + 1.2em);height:calc(var(--wheel) + 1.2em);flex:none;margin:-.45em 0 -.6em}.head-wheel .wheel{width:100%;height:100%}.info .progression th{padding-left:0}.bar-row{flex-wrap:wrap;align-items:center;gap:.6em;display:flex}.title{font-family:var(--bold);letter-spacing:.02em;margin-right:.6em;font-size:1.6em;font-weight:400}.title span{color:var(--brass-light)}.key-pick{background:var(--brass);color:var(--ink);cursor:pointer;border-radius:.4em;align-items:center;gap:.4em;padding:.15em .4em .15em .8em;display:flex}.key-caption{text-transform:uppercase;letter-spacing:.1em;font-size:.8em}.key-pick select{color:var(--ink);cursor:pointer;font-family:var(--bold);background:0 0;border:0;font-size:1.6em;line-height:1.1}.key-pick:focus-within{outline:.19em solid var(--focus);outline-offset:.12em}.segmented{border:.0625em solid var(--brass);border-radius:.4em;display:inline-flex}.segmented button:first-child{border-radius:.34em 0 0 .34em}.segmented button:last-child{border-radius:0 .34em .34em 0}.segmented button:focus-visible{z-index:1;position:relative}.segmented button{color:var(--brass-light);background:0 0;border:0;min-width:2.5em;padding:.45em .8em;font-weight:600}.segmented button+button{border-left:.0625em solid var(--brass)}.segmented button[aria-pressed=true]{background:var(--brass);color:var(--ink)}.segmented button:hover:not([aria-pressed=true]){background:#b8923a26}.add{color:var(--brass-light);border:.0625em solid var(--brass);background:0 0;border-radius:.4em;padding:.45em .9em;font-weight:600}.add:disabled{opacity:.4;cursor:not-allowed}.fitted,.fitted .stage{scrollbar-gutter:auto;overflow:hidden}.stage{scrollbar-gutter:stable;flex-direction:column;flex:1;justify-content:safe center;align-items:center;gap:1.2em;min-height:0;padding:1em;display:flex;overflow:auto}.block{flex-direction:column;align-items:center;gap:1.2em;display:flex}.progression{justify-content:center;display:flex}.progression table{border-collapse:collapse}.progression th{text-align:right;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);padding:.15em 1.2em .15em 0;font-size:.8em;font-weight:600}.progression td{text-align:center;padding:.1em .9em;line-height:1.1}.progression td+td{border-left:.0625em solid var(--line)}.progression .nashville td{font-family:var(--bold);color:var(--brass-light);font-size:2.2em}.progression .names td{font-family:var(--bold);color:var(--paper);font-size:1.4em}.pick{cursor:pointer;border-bottom:.06em dashed #b8923a73;display:inline-block;position:relative}.pick:hover{border-bottom-style:solid}.pick select{opacity:0;cursor:pointer;appearance:none;border:0;width:100%;height:100%;font-size:1rem;position:absolute;inset:0}.pick:focus-within{outline:.12em solid var(--focus);outline-offset:.1em;border-radius:.1em}.progression sup{vertical-align:.7em;margin-left:.04em;font-size:.6em;line-height:0}.grid{grid-template-columns:repeat(var(--cols), var(--card));justify-content:center;gap:1em;display:grid}.card{background:var(--warm);border:.0625em solid var(--line);border-radius:.8em;flex-direction:column;gap:.6em;padding:.9em;display:flex;position:relative}.card-head{justify-content:center;align-items:baseline;gap:.9em;display:flex}.chord-name{font-family:var(--bold);font-size:3.4em;line-height:1}.chord-ids{flex-direction:column;align-items:flex-end;gap:.15em;display:flex}.chord-number{font-family:var(--bold);color:var(--brass-light);align-items:baseline;font-size:2.2em;display:flex}.chord-number select{appearance:none;font:inherit;color:inherit;cursor:pointer;text-align:right;background:0 0;border:0;border-bottom:.06em dashed #b8923a80;border-radius:0;padding:0 .05em}.chord-number select:hover{border-bottom-style:solid}.chord-number select:focus-visible{outline-offset:.06em;outline-width:.09em}.chord-number .mark,.progression .mark{margin-left:.02em}.chord-type{background:var(--ink);color:var(--cream);border:.0625em solid var(--line);cursor:pointer;border-radius:.4em;align-self:center;margin-top:.35em;padding:.25em .5em;font-size:.85em;font-weight:600}.chord-type:hover{border-color:var(--brass)}.chord-number sup{align-self:flex-start;margin:.05em 0 0 .04em;font-size:.6em;line-height:1}.instruments{flex-direction:column;gap:.8em;display:flex}.instruments svg{width:100%;height:auto;display:block}.toggle{min-width:2.5em;color:var(--brass-light);border:.0625em solid var(--brass);background:0 0;border-radius:.4em;padding:.35em .6em;font-weight:700}.toggle[aria-pressed=true]{background:var(--brass);color:var(--ink)}.remove{width:1.8em;height:1.8em;color:var(--muted);background:0 0;border:0;border-radius:50%;place-items:center;padding:0;font-size:.85em;display:grid;position:absolute;top:.35em;right:.35em}.remove:hover{color:var(--paper);border-color:var(--muted);background:#ffffff14}.guitar .fret{stroke:var(--muted);stroke-width:1.2px}.guitar .nut{stroke:var(--paper);stroke-width:4px}.guitar .string{stroke:var(--cream);stroke-width:1.4px}.guitar .bass-string{stroke-width:2.4px}.guitar .root-ring{fill:none;stroke-width:2px}.guitar .muted{fill:var(--muted);font-size:11px;font-weight:700}.guitar .base-fret{fill:var(--brass-light);font-family:var(--bold);font-size:14px}.dot-label{font-family:var(--bold);pointer-events:none;font-size:10.5px}.keys .key.white{fill:var(--cream);stroke:var(--ink);stroke-width:1px}.keys .key.black{fill:#1a1d10;stroke:var(--ink);stroke-width:1px}.key-label{font-family:var(--bold);pointer-events:none;font-size:10px}.legend{color:var(--cream);flex-wrap:wrap;justify-content:center;gap:.5em 1em;padding:0;font-size:.85em;list-style:none;display:flex}.legend li{align-items:center;gap:.4em;display:flex}.swatch{width:1.6em;height:1.6em;font-family:var(--bold);color:#fff;border-radius:50%;place-items:center;font-size:.9em;display:inline-grid}.scale-card{background:var(--warm);border:.0625em solid var(--line);border-radius:.8em;flex-direction:column;align-items:center;gap:1.2em;width:46em;padding:1.2em 1.5em 1.5em;display:flex}.scale-name{font-family:var(--bold);letter-spacing:.01em;font-size:2.2em;font-weight:400}.scale-card svg{width:100%;height:auto;display:block}.scale-card .keys{width:70%}.fretboard .fret{stroke:var(--muted);stroke-width:1.4px}.fretboard .nut{stroke:var(--paper);stroke-width:4px}.fretboard .string{stroke:var(--cream);stroke-width:1.2px}.fretboard .inlay{fill:#e8e0d02e}.fretboard .fret-number{fill:var(--muted);font-family:var(--bold);font-size:11px}.fretboard .root-ring{fill:none;stroke-width:2px}.fretboard .dot-label{font-size:9.5px}.preset-pick select,.scale-pick select{background:var(--ink);color:var(--brass-light);border:.0625em solid var(--brass);cursor:pointer;border-radius:.4em;padding:.45em .6em;font-weight:600}.wheel{--turn:.55s cubic-bezier(.45, 0, .2, 1);display:block}.wheel-outer{fill:none;stroke:var(--brass);stroke-width:1.5px}.wheel-inner{fill:none;stroke:var(--brass);stroke-width:1.1px}.wheel-hub{fill:var(--ink);stroke:var(--brass);stroke-width:1.1px}.wheel .divider{stroke:#b8923acc;stroke-width:1.8px}.wheel-notes{transition:transform var(--turn);will-change:transform}.wheel-notes text{transition:transform var(--turn), fill var(--turn)}.wheel-note{cursor:pointer;outline:none}.note-hit{fill:#0000;stroke:#0000;stroke-width:1.5px;transition:fill var(--turn), stroke var(--turn)}.note-hit.current{fill:var(--brass-light);stroke:var(--paper)}.wheel-note:hover .note-hit:not(.current){stroke:var(--brass-light);transition-duration:.15s}.wheel-note-label{fill:var(--paper);font-family:var(--bold);pointer-events:none;font-size:17px}.wheel-note-label.current{fill:var(--ink)}.wheel-number{font-family:var(--bold);pointer-events:none;font-size:14px}.number-used{stroke:var(--paper);stroke-width:1.2px}.wheel-pointer{fill:var(--brass-light)}.wheel-hub-label{fill:var(--brass-light);font-family:var(--bold);pointer-events:none;animation:hub-in var(--turn);font-size:19px}@keyframes hub-in{0%{opacity:0}}@media (prefers-reduced-motion:reduce){.wheel-notes,.wheel-notes text,.note-hit{transition:none}.wheel-hub-label{animation:none}}@media (width<=700px){.fitted .stage{overflow:auto}.title{width:100%;font-size:1.2em}.scale-toggle{display:none}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.75em;width:100%}.card{padding:.6em}.chord-name{font-size:2.4em}.scale-card{width:100%;padding:.8em}.scale-card .keys{width:100%}.scale-name{font-size:1.5em}.chord-number{font-size:1.6em}.stage{justify-content:flex-start;padding:.75em}.block{width:100%}.head{gap:.75em;padding:.5em .75em .75em}.head-wheel{max-width:7em;max-height:7em;margin:0}.progression{justify-content:flex-start;max-width:100%;overflow-x:auto}.progression .nashville td{font-size:1.5em}.progression .names td{font-size:1.05em}.progression td{padding:.1em .5em}}