.page-tool{min-height:100vh}.chrome__tools--always{display:flex}.lights[aria-pressed=false] svg{opacity:.55}.tool{z-index:var(--z-copy);position:relative}.tool__panel{width:min(31rem,39vw);margin-left:clamp(var(--space-5), 5vw, var(--space-9));padding:calc(var(--space-9) + var(--space-3)) 0 var(--space-9);gap:var(--space-6);display:grid}.tool__panel h1{max-width:none;font-size:clamp(2.4rem,1.4rem + 3.2vw,4rem)}.tool__lede{font-size:var(--text-md);color:var(--fg-2);max-width:45ch}.field{gap:var(--space-3);display:grid}.field__label{font-family:var(--font-body);font-stretch:100%;font-size:var(--text-xs);letter-spacing:var(--track-label);text-transform:uppercase;color:var(--fg-mute);font-weight:650}.row{align-items:center;gap:var(--space-2);flex-wrap:wrap;display:flex}.notepick{gap:var(--space-2);grid-template-columns:repeat(6,minmax(0,1fr));display:grid}.notepick button{min-height:3.1rem;padding:var(--space-1);border:var(--rule-w) solid var(--hair);border-radius:var(--radius-s);background:var(--chip);color:var(--fg);font-family:var(--font-display);font-weight:680;font-stretch:108%;font-size:var(--text-base);cursor:pointer;transition:background-color var(--dur-short) var(--ease-out), border-color var(--dur-short) var(--ease-out), color var(--dur-short) var(--ease-out);align-content:center;place-items:center;line-height:1.05;display:grid;position:relative}.notepick button .alt{color:var(--fg-2);font-size:.72rem;font-weight:540;display:block}.notepick button .chip{background:var(--pc);width:7px;height:7px;box-shadow:0 0 0 1px var(--fg);border-radius:50%;position:absolute;top:5px;right:5px}.notepick button:hover{border-color:var(--fg)}.notepick button[aria-checked=true]{background:var(--fg);color:var(--chip);border-color:var(--fg)}.notepick button[aria-checked=true] .alt{color:var(--chip-2)}.typepick{gap:var(--space-2);flex-wrap:wrap;display:flex}.typepick button{border:var(--rule-w) solid var(--hair);border-radius:var(--radius-s);background:var(--chip);padding:var(--space-2) var(--space-3);font-size:var(--text-sm);cursor:pointer;white-space:nowrap;transition:background-color var(--dur-short) var(--ease-out), color var(--dur-short) var(--ease-out), border-color var(--dur-short) var(--ease-out);font-weight:600}.typepick button:hover{border-color:var(--fg)}.typepick button[aria-checked=true]{background:var(--fg);color:var(--chip);border-color:var(--fg)}.readout-card{gap:var(--space-3);padding:var(--space-5) 0;border-top:var(--rule-w) solid var(--hair);border-bottom:var(--rule-w) solid var(--hair);display:grid}.readout-card .big,.namer .big{font-family:var(--font-display);font-weight:800;font-stretch:120%;font-size:var(--text-xl);letter-spacing:var(--track-tight);line-height:1.05}.mono{font-family:var(--font-mono);font-size:var(--text-md);letter-spacing:.02em;font-variant-numeric:tabular-nums}.steps{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--fg-2)}.intervals{gap:var(--space-1);font-size:var(--text-sm);color:var(--fg-2);margin:0;padding:0;list-style:none;display:grid}.intervals b{min-width:2.6em;color:var(--fg);font-family:var(--font-mono);font-weight:400;display:inline-block}.chordrow{gap:var(--space-2);grid-template-columns:repeat(7,minmax(0,1fr));display:grid}.chordbtn{padding:var(--space-2) 2px;border:var(--rule-w) solid var(--hair);border-radius:var(--radius-s);background:var(--chip);cursor:pointer;transition:background-color var(--dur-short) var(--ease-out), color var(--dur-short) var(--ease-out), border-color var(--dur-short) var(--ease-out);justify-items:center;gap:2px;display:grid}.chordbtn .roman{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--fg-2)}.chordbtn .sym{font-family:var(--font-display);font-weight:700;font-size:var(--text-sm);white-space:nowrap}.chordbtn:hover{border-color:var(--fg)}.chordbtn[aria-pressed=true]{background:var(--fg);color:var(--chip);border-color:var(--fg)}.chordbtn[aria-pressed=true] .roman{color:var(--chip-2)}.neighbours{gap:var(--space-2);grid-template-columns:minmax(0,1fr) minmax(0,1fr);display:grid}.neigh{align-items:center;gap:var(--space-3);text-align:left;border:var(--rule-w) solid var(--hair);border-radius:var(--radius-s);background:var(--chip);padding:var(--space-3);font-size:var(--text-sm);color:var(--fg-2);cursor:pointer;display:flex}.neigh b{color:var(--fg);font-weight:700}.neigh .dir{font-size:var(--text-lg);color:var(--fg)}.neigh:hover{border-color:var(--fg)}.neigh:last-child{justify-content:space-between}.modes{gap:var(--space-1) var(--space-3);min-width:0;font-size:var(--text-sm);flex-wrap:wrap;flex:1 1 0;margin:0;padding:0;list-style:none;display:flex}.modes li button{color:var(--fg-2);text-decoration:none}.modes li[data-current] button{color:var(--fg);font-weight:760;text-decoration:underline;text-decoration-thickness:2px}.kmap{height:6.2rem;display:flex;position:relative}.kmap__w{border:var(--rule-w) solid var(--fg);background:var(--paper);border-right-width:0;border-radius:0 0 4px 4px;flex:1 1 0;position:relative}.kmap__w:last-of-type{border-right-width:var(--rule-w)}.kmap__b{background:var(--ink);border:var(--rule-w) solid var(--ink);z-index:2;border-radius:0 0 3px 3px;height:58%;position:absolute;top:0}.kmap i{background:var(--pc);width:.8rem;height:.8rem;box-shadow:0 0 0 1.5px var(--ink);border-radius:50%;margin-left:-.4rem;position:absolute;bottom:.55rem;left:50%}.kmap__b i{width:.62rem;height:.62rem;box-shadow:0 0 0 1.5px var(--paper);margin-left:-.31rem;bottom:.4rem}.kmap .is-root i{width:1rem;height:1rem;box-shadow:0 0 0 2.5px var(--ink);margin-left:-.5rem}.kmap__b.is-root i{box-shadow:0 0 0 2.5px var(--paper)}.fmap{font-family:var(--font-mono);grid-template-columns:1.4rem repeat(13,minmax(0,1fr));font-size:.62rem;display:grid}.fmap__fret{text-align:center;color:var(--fg-mute);padding-bottom:var(--space-1)}.fmap__name{color:var(--fg-2);align-items:center;display:flex}.fmap__cell{border-left:1.5px solid var(--fg-mute);place-items:center;height:1.65rem;display:grid;position:relative}.fmap__cell:before{content:"";background:var(--fg-2);height:1px;position:absolute;top:50%;left:0;right:0}.fmap__cell.is-open{border-left:3px solid var(--fg)}.fmap__cell i{background:var(--pc);width:1.25rem;height:1.25rem;color:var(--ink);box-shadow:0 0 0 1.5px var(--ink);border-radius:50%;place-items:center;font-size:.56rem;font-style:normal;font-weight:700;display:grid;position:relative}.fmap__cell i.is-root{box-shadow:0 0 0 2.5px var(--ink), 0 0 0 4px var(--chip)}.namer__out{min-height:4.2rem}.namer .mono{font-size:var(--text-sm);color:var(--fg-2)}.ring-ui .note.is-tonic .note__label{text-underline-offset:.16em;text-decoration:underline;text-decoration-thickness:2px}@media (max-width:860px){.chrome__tools--always{gap:var(--space-3);margin-left:auto}.chrome__tools--always a{font-size:var(--text-xs)}.page-tool .chrome{row-gap:var(--space-2);flex-wrap:wrap}.page-tool .order{order:5}.page-tool .lights span{display:none}.tool__panel{width:auto;padding:var(--space-6) var(--space-4) var(--space-9);background:color-mix(in oklab, var(--chip) 94%, transparent);border-top:var(--rule-w) solid var(--hair);border-radius:var(--radius-m) var(--radius-m) 0 0;margin:58vh 0 0}.notepick button{min-height:2.8rem}.chordrow{grid-template-columns:repeat(4,minmax(0,1fr))}.neighbours{grid-template-columns:minmax(0,1fr)}.credits{background:color-mix(in oklab, var(--chip) 94%, transparent);max-width:none;margin:0}.page-tool .status{display:none}}.stage-fallback--still{opacity:1!important}.page-doc .chrome{position:absolute}.doc{z-index:var(--z-copy);width:min(42rem,100% - 2rem);padding:calc(var(--space-9) + var(--space-4)) 0 var(--space-9);gap:var(--space-6);margin:0 auto;display:grid;position:relative}.doc h1{font-size:clamp(2.4rem,1.4rem + 3.4vw,4.2rem)}.doc__lede{font-size:var(--text-lg);color:var(--fg-2);max-width:45ch;line-height:1.4}.doc section{gap:var(--space-3);padding-top:var(--space-5);border-top:var(--rule-w) solid var(--hair);display:grid}.doc h2{font-size:var(--text-lg);font-stretch:112%}.doc p{font-size:var(--text-md);max-width:62ch}.doc p a{white-space:normal}