.session-nav{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:24px}.session-nav a{color:var(--muted);text-decoration:none;font-size:14px;border:1px solid var(--border);border-radius:7px;padding:8px 12px}.session-nav a[aria-current]{color:var(--root);border-color:var(--root)}.controls{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:24px}.controls label{font-size:14px;display:flex;align-items:center;gap:8px}.controls button{font-size:14px}.scale-row,.chord-row{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}.scale-note{padding:12px 3px}.scale-note strong{font-size:22px;display:block}.scale-note small{font-size:12px;color:var(--muted)}.scale-note.in-chord{border-color:var(--third);background:#36302a}.scale-note[aria-pressed=true]{border-color:var(--root);background:#2e3c27}.chord-button{padding:10px 2px;min-width:0}.chord-button strong{display:block;font-size:15px}.chord-button small{font-size:12px;color:var(--muted)}.chord-button[aria-pressed=true]{border-color:var(--root);background:#2e3c27}.separator{height:1px;background:var(--border);margin:22px 0}.analysis-heading{display:flex;justify-content:space-between;align-items:center;gap:16px}.analysis-heading h2{font-size:34px}.analysis-heading p{font-size:14px}.stack{display:flex;gap:14px;margin:24px 0;align-items:center;flex-wrap:wrap}.stack-note{border:1px solid var(--border);border-radius:10px;padding:14px 20px;text-align:center;min-width:86px}.stack-note strong{font-size:28px;display:block}.stack-note span{font-size:14px;color:var(--muted)}.stack-note:nth-child(1){border-color:var(--root);color:var(--root)}.stack-note:nth-child(2){border-color:var(--third);color:var(--third)}.stack-note:nth-child(3){border-color:var(--fifth);color:var(--fifth)}.stack-note:nth-child(4){border-color:var(--seventh);color:var(--seventh)}.quiz{align-self:start}.quiz h2{margin:8px 0}.quiz p{font-size:14px}.quiz h3{font-size:18px}.options{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.options button{padding:10px 4px}.options button[aria-pressed=true]{color:#172313;background:var(--root)}.quiz #check,.quiz #next,.quiz #again{width:100%;margin-top:10px}.quiz #feedback{min-height:65px}.correct{color:var(--root)}#key-note{min-height:44px}#storage{font-size:12px}.session-nav a:focus-visible{outline:3px solid var(--seventh);outline-offset:3px}@media(max-width:1120px){.quiz{max-width:none}.options{grid-template-columns:repeat(7,1fr)}}@media(max-width:640px){.scale-row,.chord-row{gap:4px}.scale-note strong{font-size:17px}.chord-button strong{font-size:11px}.chord-button small{font-size:11px}.controls label{flex-wrap:wrap}.controls select{max-width:240px}.section-title{flex-wrap:wrap}.analysis-heading{align-items:start;flex-direction:column}.stack{gap:7px}.stack-note{padding:12px 5px;min-width:0;flex:1}.stack-note strong{font-size:24px}.options{grid-template-columns:repeat(4,1fr)}.session-nav a{font-size:12px}.quiz h3{font-size:17px}}

@media(max-width:640px){.chord-row{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.chord-button strong{font-size:14px}.chord-button small{font-size:12px}}

.interval-intro{margin:12px 0 18px;padding:14px;border-left:3px solid var(--root);background:#222c23;border-radius:6px}.interval-intro strong{font-size:18px}.interval-intro p{font-size:14px;margin:6px 0 0}.scale-scroll{overflow-x:auto;padding:5px 3px 12px}.scale-scroll:focus-visible{outline:2px solid var(--seventh);outline-offset:2px}.scale-row{grid-template-columns:repeat(7,minmax(44px,1fr) 52px) minmax(70px,1.3fr);gap:0;min-width:760px;align-items:center}.scale-gap{display:flex;flex-direction:column;align-items:center;line-height:1.4;padding:3px 0;color:var(--muted)}.scale-gap strong{font-size:14px}.scale-gap span{font-size:18px}.scale-gap small{font-size:10px}.half-step{color:var(--third);background:#352c22;border-radius:7px;margin:0 3px}.octave-note{text-align:center;border:1px dashed var(--root);border-radius:8px;color:var(--root)}.octave-note small{font-size:10px}.step-explain{font-size:14px;color:var(--text);margin-top:10px}@media(max-width:640px){.interval-intro strong{font-size:16px}.scale-row{gap:0}.scale-note strong{font-size:20px}}