.theory-foundations{margin:20px 0;padding:clamp(20px,4vw,34px);border:1px solid #24513d;border-radius:20px;background:linear-gradient(145deg,#091711,#06100c);color:#eef8f2}.theory-foundations-head{display:flex;justify-content:space-between;align-items:end;gap:20px}.theory-foundations-head h2{margin:7px 0;font-size:clamp(1.8rem,4vw,3rem)}.theory-foundations-head p{max-width:760px;margin:0;color:#b5c9bd;line-height:1.6}.theory-foundations-toggle{min-width:130px}.theory-foundation-tabs{display:flex;gap:7px;overflow-x:auto;margin:22px 0 16px;padding-bottom:4px}.theory-foundation-tabs button{flex:0 0 auto;padding:10px 13px;border:1px solid #315343;border-radius:10px;background:#0c1b15;color:#c6d8ce;font-weight:850}.theory-foundation-tabs button.active{border-color:#57eea2;background:#153526;color:#fff}.theory-foundation-panel{padding:20px;border:1px solid #294738;border-radius:15px;background:#07110d}.theory-foundation-panel>h3{margin:0 0 8px;font-size:1.45rem}.theory-foundation-panel>p{color:#b6c8be;line-height:1.65}.theory-card-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:16px 0}.theory-card-grid article,.clef-card,.meter-card{padding:16px;border:1px solid #315042;border-radius:12px;background:#0b1813}.theory-card-grid h4,.clef-card h4,.meter-card h4{margin:4px 0 8px}.theory-card-grid p,.clef-card p,.meter-card p{margin:0;color:#aec1b6;line-height:1.55}.music-example{display:block;width:100%;height:auto;margin:12px 0;border-radius:10px;background:#fff}.music-example .staff{stroke:#1a2320;stroke-width:1.4}.music-example text{fill:#101713;font-family:Georgia,serif}.music-example .note{fill:#111}.music-example .mark{fill:none;stroke:#111;stroke-width:2}.theory-callout{margin:14px 0;padding:15px;border-left:4px solid #5aeca2;border-radius:0 11px 11px 0;background:#10241b;color:#d8e8df;line-height:1.6}.clef-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:16px 0}.clef-glyph{display:block;color:#63efa9;font-family:serif;font-size:3.4rem;line-height:1}.clef-positions{display:flex;flex-wrap:wrap;gap:5px;margin-top:10px}.clef-positions span{padding:5px 7px;border-radius:99px;background:#152b22;color:#aee9ca;font-size:.72rem}.rhythm-value-table{width:100%;border-collapse:collapse;margin:16px 0;font-size:.9rem}.rhythm-value-table th,.rhythm-value-table td{padding:11px;border:1px solid #315043;text-align:left}.rhythm-value-table th{background:#142a21;color:#69efad}.rhythm-value-table td{color:#d2ded7}.rhythm-symbol{font-size:1.55rem}.tie-demo{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:13px}.theory-sound{padding:10px 13px;border:1px solid #39bd78;border-radius:9px;background:#123825;color:#fff;font-weight:900}.meter-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:16px 0}.meter-sign{display:block;color:#65eeaa;font-size:2rem;font-weight:950}.degree-table{width:100%;border-collapse:collapse;margin:16px 0}.degree-table th,.degree-table td{padding:10px;border:1px solid #315043}.degree-table th{background:#142a21;color:#62eda8}.degree-table tr.tonal td{background:rgba(85,235,159,.08)}.degree-table small{color:#93aa9d}.theory-exercises{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:16px}.theory-exercise{padding:14px;border:1px solid #315043;border-radius:12px;background:#0a1712}.theory-exercise label{display:grid;gap:7px;color:#dce9e2;font-weight:850}.theory-exercise input{min-height:40px;padding:8px 10px;border:1px solid #426453;border-radius:8px;background:#07110d;color:#fff}.theory-exercise button{margin-top:8px}.theory-answer{min-height:1.3em;margin:8px 0 0;color:#a9beb2;font-size:.84rem}.theory-answer.ok{color:#62efa8}.theory-answer.no{color:#ffc17b}.theory-quiz-options{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}.theory-quiz-options button{padding:11px;border:1px solid #3b5a4a;border-radius:9px;background:#0c1b15;color:#e1eee7;text-align:left}.theory-quiz-options button.correct{border-color:#5cf0a6;background:#153b27}.theory-quiz-options button.wrong{border-color:#d87868;background:#351916}.theory-quiz-status{margin-top:10px;color:#b7c9bf}.ledger-note{color:#b5c7bd;font-size:.9rem}.theory-foundations-progress{display:flex;align-items:center;gap:10px;margin-top:16px}.theory-foundations-progress span{flex:1;height:7px;border-radius:99px;background:#20372d;overflow:hidden}.theory-foundations-progress i{display:block;height:100%;width:0;background:#5aeca2}.theory-foundations-progress strong{color:#66efaa}
@media(max-width:760px){.theory-foundations-head{align-items:stretch;flex-direction:column}.theory-card-grid,.clef-grid,.meter-grid,.theory-exercises,.theory-quiz-options{grid-template-columns:1fr}.tie-demo{grid-template-columns:1fr}.rhythm-value-table{display:block;overflow-x:auto}.theory-foundation-panel{padding:15px}}