/* B077SV — focused single-view layouts for Scale Foundations 2.2–2.3
   and Shape & Connect 4.1–4.6. Scoped so no other Academy lesson moves. */

/* 2.2 Build a Scale / 2.3 Scale Quiz: the Academy header and About panel own
   the objective and lesson path. Keep the active task and keyboard central. */
@media (min-width:901px) and (min-height:760px){
  html.cwFoundationFamily:is(.ha-build,.ha-quiz) .main{padding-top:6px!important;padding-bottom:18px!important}
  html.cwFoundationFamily:is(.ha-build,.ha-quiz) .wrap{gap:8px!important}
  html.cwFoundationFamily:is(.ha-build,.ha-quiz) .haIntroGrid{
    grid-template-columns:1fr!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
  }
  html.cwFoundationFamily:is(.ha-build,.ha-quiz) .haIntroPanel.message,
  html.cwFoundationFamily:is(.ha-build,.ha-quiz) .haPathDisclosure{display:none!important}
  html.cwFoundationFamily:is(.ha-build,.ha-quiz) .haTitlePanel{
    min-height:0!important;
    padding:8px 12px!important;
  }
  html.cwFoundationFamily:is(.ha-build,.ha-quiz) .haTitlePanel .eyebrow{margin:0 0 2px!important}
  html.cwFoundationFamily:is(.ha-build,.ha-quiz) .haTitlePanel h1{margin:0!important;font-size:1.55rem!important;line-height:1.05!important}
  html.cwFoundationFamily:is(.ha-build,.ha-quiz) .haTitlePanel .lead{display:none!important}
  html.cwFoundationFamily:is(.ha-build,.ha-quiz) .haStackedLesson{
    grid-template-columns:minmax(390px,.78fr) minmax(600px,1.22fr)!important;
    gap:8px!important;
  }
  html.cwFoundationFamily:is(.ha-build,.ha-quiz) .card{padding:10px!important}
  html.cwFoundationFamily:is(.ha-build,.ha-quiz) .haActivity,
  html.cwFoundationFamily:is(.ha-build,.ha-quiz) .haKeyboardArea{gap:8px!important}
  html.cwFoundationFamily:is(.ha-build,.ha-quiz) .haKeyboardArea .keyboard{
    height:250px!important;
    min-height:250px!important;
    max-height:250px!important;
  }
}

@media (min-width:901px){
  /* 2.2: retain one formula—the keyboard-aligned strip—and one live status. */
  html.cwFoundationFamily.ha-build .haActivity .infoGrid{grid-template-columns:1fr!important}
  html.cwFoundationFamily.ha-build .haActivity .infoGrid>.info:first-child,
  html.cwFoundationFamily.ha-build .haActivity>.card>.formulaStrip,
  html.cwFoundationFamily.ha-build .haKeyboardArea>.card:nth-child(2){display:none!important}
  html.cwFoundationFamily.ha-build .haActivity .controls{margin:5px 0!important}
  html.cwFoundationFamily.ha-build .haActivity .info{padding:8px 10px!important}
  html.cwFoundationFamily.ha-build .haActivity .info .copy{margin:4px 0 0!important;line-height:1.35!important}
  html.cwFoundationFamily.ha-build .haActivity .scaleRow{margin:7px 0!important}
  html.cwFoundationFamily.ha-build .haActivity .noteBox{padding:6px 3px!important}
  html.cwFoundationFamily.ha-build .haActivity .noteBox b{font-size:1.15rem!important}
  html.cwFoundationFamily.ha-build .testBox{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;margin-top:7px!important;padding:7px 9px!important}
  html.cwFoundationFamily.ha-build .testBox .copy{display:none!important}
  html.cwFoundationFamily.ha-build .summary{margin-top:7px!important;padding:7px 9px!important}
  html.cwFoundationFamily.ha-build .summary h3{display:inline!important;margin-right:8px!important;font-size:.82rem!important}
  html.cwFoundationFamily.ha-build .summary .copy{display:inline!important;font-size:.74rem!important;line-height:1.3!important}
  html.cwFoundationFamily.ha-build .keyboardFormulaStrip{min-height:62px!important;margin:2px 0 6px!important;padding:5px!important}
  html.cwFoundationFamily.ha-build .keyboardFormulaStrip .token{min-height:50px!important}
  html.cwFoundationFamily.ha-build .haKeyboardTheory{min-height:62px!important;margin:2px 0 6px!important;padding:5px!important}
  html.cwFoundationFamily.ha-build .haTheoryPoint{min-width:54px!important;padding:3px!important}
  html.cwFoundationFamily.ha-build #keyboardNote{margin:5px 0 0!important;font-size:.72rem!important}

  /* 2.3: the quiz assesses formula recall, so the permanent answer panel is
     removed. Progress and score stay with the active question. */
  html.cwFoundationFamily.ha-quiz .haKeyboardArea>.card:nth-child(2),
  html.cwFoundationFamily.ha-quiz .haKeyboardArea>.card:nth-child(3){display:none!important}
  html.cwFoundationFamily.ha-quiz .haQuizOptions>summary{min-height:42px!important;padding:8px 11px!important}
  html.cwFoundationFamily.ha-quiz .haQuizOptionsBody{padding:0 10px 10px!important}
  html.cwFoundationFamily.ha-quiz .haQuizQuestion{padding:10px!important}
  html.cwFoundationFamily.ha-quiz .haQuizQuestion .question{margin:3px 0 7px!important;font-size:1.05rem!important}
  html.cwFoundationFamily.ha-quiz .scaleSlots{margin:7px 0!important;gap:5px!important}
  html.cwFoundationFamily.ha-quiz .slot{min-height:58px!important;font-size:1.05rem!important}
  html.cwFoundationFamily.ha-quiz .choiceRow{flex-wrap:nowrap!important;overflow-x:auto!important}
  html.cwFoundationFamily.ha-quiz .choice{min-width:62px!important;padding:7px 9px!important}
  html.cwFoundationFamily.ha-quiz .feedback{margin-top:7px!important;padding:8px 10px!important}
  html.cwFoundationFamily.ha-quiz .haQuizActionRow{margin-top:7px!important}
  html.cwFoundationFamily.ha-quiz .haQuizProgress{margin-top:7px!important;padding-top:7px!important}
  html.cwFoundationFamily.ha-quiz #keyboardNote{margin:5px 0 0!important;font-size:.72rem!important}
}

/* 4.1–4.6: compact the framing and retain the creation workspace. The full
   explanations remain available through About this lesson. */
@media (min-width:901px) and (min-height:740px){
  html.cwProgressionModernFamily body[data-lesson] .lesson-nav{height:58px!important}
  html.cwProgressionModernFamily body[data-lesson] .lesson-content{padding:14px 30px 22px!important}
  html.cwProgressionModernFamily body[data-lesson] .lesson-intro{
    grid-template-columns:minmax(0,1fr) minmax(390px,.9fr)!important;
    gap:18px!important;
    align-items:center!important;
    padding:0 0 9px!important;
  }
  html.cwProgressionModernFamily body[data-lesson] .lesson-intro .eyebrow{margin-bottom:2px!important}
  html.cwProgressionModernFamily body[data-lesson] .lesson-intro h1{margin-bottom:2px!important;font-size:1.8rem!important;line-height:1.02!important}
  html.cwProgressionModernFamily body[data-lesson] .lesson-summary{font-size:.78rem!important;line-height:1.3!important}
  html.cwProgressionModernFamily body[data-lesson] .objective{padding:8px 11px!important;gap:8px!important}
  html.cwProgressionModernFamily body[data-lesson] .objective-icon{display:none!important}
  html.cwProgressionModernFamily body[data-lesson] .objective p{font-size:.72rem!important;line-height:1.3!important}
  html.cwProgressionModernFamily body[data-lesson] .start-card{padding:7px 11px!important;margin-bottom:8px!important;gap:12px!important}
  html.cwProgressionModernFamily body[data-lesson] .start-heading{min-width:260px!important;gap:8px!important}
  html.cwProgressionModernFamily body[data-lesson] .start-number{width:24px!important;height:24px!important}
  html.cwProgressionModernFamily body[data-lesson] .start-heading p:last-child{font-size:.7rem!important;line-height:1.25!important}
  html.cwProgressionModernFamily body[data-lesson] .activity{padding:10px 12px!important}
  html.cwProgressionModernFamily body[data-lesson] .activity-toolbar{margin-bottom:7px!important}
  html.cwProgressionModernFamily body[data-lesson] .activity-toolbar .section-label{margin-bottom:1px!important}
  html.cwProgressionModernFamily body[data-lesson] .activity-toolbar h2{font-size:1rem!important}
  html.cwProgressionModernFamily body[data-lesson] .activity-grid{grid-template-columns:270px minmax(0,1fr)!important;gap:9px!important}
  html.cwProgressionModernFamily body[data-lesson] .control-panel{gap:6px!important}
  html.cwProgressionModernFamily body[data-lesson] .control-section{padding:8px 9px!important}
  html.cwProgressionModernFamily body[data-lesson] .control-title{margin-bottom:4px!important}
  html.cwProgressionModernFamily body[data-lesson] .inversion-options{gap:2px!important}
  html.cwProgressionModernFamily body[data-lesson] .inversion-option{min-height:36px!important;padding:3px 6px!important}
  html.cwProgressionModernFamily body[data-lesson] .notice-card{display:none!important}
  html.cwProgressionModernFamily body[data-lesson] .workspace{gap:6px!important}
  html.cwProgressionModernFamily body[data-lesson] .chord-step{min-height:43px!important;padding:5px 7px!important}
  html.cwProgressionModernFamily body[data-lesson] .keyboard-card{padding:7px 9px 6px!important}
  html.cwProgressionModernFamily body[data-lesson] .keyboard-heading{margin-bottom:5px!important}
  html.cwProgressionModernFamily body[data-lesson] .piano{height:174px!important}
  html.cwProgressionModernFamily body[data-lesson] .keyboard-legend{margin-top:4px!important}
  html.cwProgressionModernFamily body[data-lesson] .live-feedback{min-height:42px!important;padding:5px 8px!important}
  html.cwProgressionModernFamily body[data-lesson] .explanation,
  html.cwProgressionModernFamily body[data-lesson] .why-card{margin-top:7px!important}
  html.cwProgressionModernFamily body[data-lesson] .explanation{display:block!important;padding:0!important}
  html.cwProgressionModernFamily body[data-lesson] .explanation>summary,
  html.cwProgressionModernFamily body[data-lesson] .why-card>summary{min-height:38px!important;padding:7px 11px!important}
  html.cwProgressionModernFamily body[data-lesson] .explanation:not([open]) .supporting-grid,
  html.cwProgressionModernFamily body[data-lesson] .why-card:not([open]) .why-content{display:none!important}
  html.cwProgressionModernFamily body[data-lesson] .lesson-footer{display:none!important}
  html.cwProgressionModernFamily body[data-lesson="inversions"] .inversion-options,
  html.cwProgressionModernFamily body[data-lesson="seventhInversions"] .inversion-options,
  html.cwProgressionModernFamily body[data-lesson="voicings"] .inversion-options{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  html.cwProgressionModernFamily body[data-lesson="smartInversions"] .activity-grid{grid-template-columns:1fr!important}
}