.scales-settings{justify-content:space-between}
.scales-app .scale-instruction{margin:14px auto 20px}
.scale-formula{font-size:1rem;line-height:1.7;margin:18px auto 22px}
.scale-formula>span{display:block;font-size:.875rem;color:var(--muted)}
.scale-ladder{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));list-style:none;margin:0 0 24px;padding:0;gap:8px}
.scale-ladder li{min-width:0;padding:12px 4px;border:1px solid var(--line);border-radius:12px;background:#f5f7f3;display:flex;flex-direction:column;align-items:center;gap:7px}
.scale-ladder li small{font-size:.75rem;color:var(--muted)}
.scale-ladder li strong{font-size:1rem;min-height:24px}
.scale-ladder li.scale-known{background:#edf5d3;border-color:#a2b776}
.scale-ladder li.scale-next{border:2px dashed #5368b5;background:#fff}
.scale-ladder li.scale-sounding{background:#182326;color:#fff;border-color:#182326}
.scale-ladder li.scale-sounding small{color:#e7eedf}
.scale-task{font-size:1.1rem;font-weight:650;line-height:1.6;margin:10px 0 20px}
.scale-task:empty{display:none}
.scales-app .step-key-marker{font-size:.8rem}
.scales-app .scale-member{background:#dceeb7;color:#182326;box-shadow:inset 0 -5px #9fb971}
.scales-app .step-origin{background:var(--lime);color:var(--ink)}
.scales-app .scale-hint{outline:3px dashed #354aab;outline-offset:-4px}
.scales-app .scale-wrong{background:#f6ddce;color:#772a1b;box-shadow:inset 0 -5px #c47b5a}
.scales-app .scale-sounding{background:#243d89!important;color:#fff!important;box-shadow:inset 0 -5px #17285d!important}
.scales-app .scale-sounding .step-key-marker{background:#fff;color:#243d89}
.scales-app .steps-key-options .scale-member{opacity:1}
.scales-app .scale-progress{display:flex;justify-content:center;align-items:center;gap:18px;flex-wrap:wrap;margin-top:20px}
.scales-app .scale-progress .score{white-space:normal;line-height:1.6}
.scales-app .answer-feedback{margin:24px 0}
.scales-app .steps-access{margin-top:22px}
@media(max-width:680px){.scales-settings{gap:14px}.scales-settings label{width:auto;flex:1 1 125px}.scale-ladder{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.scale-ladder li{padding:10px 4px}.scale-ladder li strong{font-size:1rem}.scale-ladder li small{font-size:.8rem}.scale-task{font-size:1rem}.scale-formula{font-size:.95rem}.scales-app .scale-progress{gap:6px}.scales-app .steps-key-options button{font-size:1rem}}
