/* B077SW — Academy default-view and Interval keyboard audit.
   Desktop-only compaction preserves the existing mobile scroll contract. */

/* Interval keyboard: distinct key-label and distance-adviser zones. */
html.cwIntroFlowFamily .cwIntervalKeyboardCard{
  overflow:hidden!important;
}
html.cwIntroFlowFamily .cwIntervalKeyboardCard .intervalKeyboard{
  height:228px!important;
  padding:0 14px 54px!important;
  overflow:hidden!important;
}
html.cwIntroFlowFamily .cwIntervalKeyboardCard .iKey{
  bottom:54px!important;
  height:142px!important;
  padding:0 2px 9px!important;
  gap:4px!important;
  font-size:18px!important;
  line-height:1!important;
}
html.cwIntroFlowFamily .cwIntervalKeyboardCard .iKey.black{
  bottom:106px!important;
  height:90px!important;
  padding-bottom:8px!important;
  font-size:15px!important;
}
html.cwIntroFlowFamily .cwIntervalKeyboardCard .iKey small{
  display:grid!important;
  place-items:center!important;
  min-width:21px!important;
  min-height:19px!important;
  margin:1px 0 0!important;
  padding:2px 4px!important;
  border-radius:5px!important;
  font-size:12px!important;
  line-height:1!important;
}
html.cwIntroFlowFamily .cwIntervalKeyboardCard .intervalAnchor{
  bottom:48px!important;
  font-size:14px!important;
}
html.cwIntroFlowFamily .cwIntervalKeyboardCard .intervalDistanceBracket{
  bottom:28px!important;
  height:17px!important;
}
html.cwIntroFlowFamily .cwIntervalKeyboardCard .intervalDistanceLabel{
  bottom:2px!important;
  max-width:calc(100% - 12px)!important;
  padding:3px 8px!important;
  font-size:13px!important;
  line-height:17px!important;
  transform:translateX(-50%)!important;
  text-align:center!important;
}
html.cwIntroFlowFamily .cwIntervalKeyboardCard .intervalOctaveBracket{
  top:2px!important;
}
html.cwIntroFlowFamily .cwIntervalKeyboardCard .intervalOctaveLabel{
  top:2px!important;
  font-size:12px!important;
}

/* The final two interval cards must retain the same geometry as every other
   stage, including their comparison keyboard. */
html.cwIntroFlowFamily .playNowSupportCard .intervalKeyboard{
  overflow:hidden!important;
}

/* Lesson 2.9 redraws the keyboard at each comparison stage.  Its movement is
   communicated by the controlled audio crossfade and changing distance rail;
   replaying the generic reveal pulse here creates an unrelated flash. */
html.cwIntroFlowFamily .cwPureIntervalShift .iKey.activeInterval,
html.cwIntroFlowFamily .cwPureIntervalShift .iKey.definingThird{
  animation:none!important;
}

/* Scale Foundations 2.1: keep the active discovery workspace in the supplied
   desktop viewport.  Supporting theory remains in its closed disclosure. */
@media (min-width:901px) and (min-height:760px){
  html.cwScalePilot .main{
    padding-top:6px!important;
    padding-bottom:14px!important;
  }
  html.cwScalePilot .cwLessonPage{
    gap:8px!important;
    padding-top:0!important;
  }
  html.cwScalePilot .cwLessonHeader{
    min-height:0!important;
    padding:8px 12px!important;
  }
  html.cwScalePilot .cwLessonHeader h1{
    margin:0!important;
    font-size:1.55rem!important;
    line-height:1.05!important;
  }
  html.cwScalePilot .cwLessonHeader p,
  html.cwScalePilot .cwLessonEyebrow{
    display:none!important;
  }
  html.cwScalePilot .cwLessonProgress{
    min-width:230px!important;
  }
  html.cwScalePilot .cwStartBar{
    padding:8px 11px!important;
    gap:9px!important;
  }
  html.cwScalePilot .cwStartInstruction p{
    display:none!important;
  }
  html.cwScalePilot .cwStartNumber{
    width:28px!important;
    height:28px!important;
  }
  html.cwScalePilot .cwSegmented button,
  html.cwScalePilot .cwActionGroup button{
    min-height:36px!important;
    padding:7px 10px!important;
  }
  html.cwScalePilot .cwActivity{
    gap:8px!important;
    grid-template-columns:minmax(0,1.22fr) minmax(360px,.78fr)!important;
  }
  html.cwScalePilot .cwKeyboardCard,
  html.cwScalePilot .cwFeedbackPanel{
    padding:10px!important;
  }
  html.cwScalePilot .cwPanelHeading h2{
    margin:1px 0!important;
    font-size:1rem!important;
  }
  html.cwScalePilot .cwPanelHeading p{
    margin:2px 0!important;
    font-size:.74rem!important;
  }
  html.cwScalePilot .cwKeyboardCard>.keyboard{
    height:270px!important;
    min-height:270px!important;
    max-height:270px!important;
  }
  html.cwScalePilot .cwKeyboardCaption{
    margin-top:5px!important;
    font-size:.7rem!important;
  }
  html.cwScalePilot .cwCurrentMove{
    padding:8px 9px!important;
  }
  html.cwScalePilot .formulaStrip{
    gap:4px!important;
    margin:6px 0!important;
  }
  html.cwScalePilot .formulaStrip .token{
    min-height:48px!important;
    padding:5px 3px!important;
  }
  html.cwScalePilot .cwResultBlock{
    padding:8px!important;
  }
  html.cwScalePilot .cwDisclosure{
    margin-top:0!important;
  }
  html.cwScalePilot .cwDisclosure>summary{
    min-height:38px!important;
    padding:7px 11px!important;
  }
  html.cwScalePilot .cwCompletion.hidden{
    display:none!important;
  }
}

/* At the supplied desktop height, keep the Interval activity framing compact
   while leaving the musical keyboard at a readable size. */
@media (min-width:901px) and (min-height:760px) and (max-height:1000px){
  html.cwIntroFlowFamily .main{padding-top:8px!important;padding-bottom:12px!important}
  html.cwIntroFlowFamily .stage{gap:8px!important}
  html.cwIntroFlowFamily .panel{padding:10px!important}
  html.cwIntroFlowFamily .cwIntervalFoundation{gap:6px!important}
  html.cwIntroFlowFamily .cwIntervalFoundationHeader{gap:8px!important}
  html.cwIntroFlowFamily .chromaticRow{margin-bottom:2px!important}
  html.cwIntroFlowFamily .chromaticBtn{padding:6px 8px!important;font-size:14px!important}
  html.cwIntroFlowFamily .cwIntervalPlayPill{min-height:35px!important;padding:6px 10px!important}
  html.cwIntroFlowFamily .cwIntervalKeyboardCard{padding:8px 11px 5px!important}
  html.cwIntroFlowFamily .cwIntervalFacts .cwIntervalFact{padding:5px 8px!important}
  html.cwIntroFlowFamily .cwIntervalFoundationMessage{padding:6px 9px!important}
}

/* The first-screen activity stays visible at the reported desktop height.
   The musical connection remains accessible in a disclosure below the series. */
@media (min-width:901px) and (max-height:1100px){
 html.cwIntroFlowFamily #visual.cwCompactSeries .seriesLiveCanvas{height:205px!important}
 html.cwIntroFlowFamily #visual.cwCompactSeries .seriesCard{padding:6px!important}
 html.cwIntroFlowFamily #visual.cwCompactSeries .seriesCard .ratio{font-size:19px!important}
 html.cwIntroFlowFamily #visual.cwCompactSeries .seriesRunControls{margin-top:5px!important}
 html.cwIntroFlowFamily #visual.cwCompactTimbre .waveCanvas{height:255px!important}
 html.cwIntroFlowFamily #visual.cwCompactTimbre .teachMini{padding:6px!important}
 html.cwIntroFlowFamily #visual.cwCompactTimbre .takeaway{padding:8px!important;margin-top:6px!important}
 html.cwIntroFlowFamily .cwSeriesSupporting{margin-top:8px;border:1px solid #365f90;border-radius:10px;padding:8px 10px;color:#c8d6eb}
 html.cwIntroFlowFamily .cwSeriesSupporting summary{cursor:pointer;font-weight:800;color:#84c4ff}
}

/* 1.15: show both standing-wave ratios and the selected frequency in one view. */
@media (min-width:901px) and (max-height:1100px){
 html.cwIntroFlowFamily #visual.cwCompactBirth .seriesLiveCanvas{height:170px!important}
 html.cwIntroFlowFamily #visual.cwCompactBirth #birthFrequencyCanvas{display:block;width:100%;height:52px;margin-top:4px;border:1px solid #234d80;border-radius:8px}
 html.cwIntroFlowFamily #visual.cwCompactBirth .seriesCard{padding:5px!important}
 html.cwIntroFlowFamily #visual.cwCompactBirth .seriesCard .ratio{font-size:18px!important}
 html.cwIntroFlowFamily #visual.cwCompactBirth .whiteNoteRow{margin:4px 0 6px!important}
 html.cwIntroFlowFamily #visual.cwCompactBirth .whiteNoteBtn{padding:6px 11px!important;font-size:16px!important}
 html.cwIntroFlowFamily #visual.cwCompactBirth .birthGrid{margin-top:6px!important;gap:6px!important}
 html.cwIntroFlowFamily #visual.cwCompactBirth .birthCard{padding:6px!important}
 html.cwIntroFlowFamily #visual.cwCompactBirth .miniWhite{height:56px!important}
 html.cwIntroFlowFamily #visual.cwCompactBirth .miniBlack{height:34px!important}
 html.cwIntroFlowFamily #visual.cwCompactBirth .takeaway{margin-top:5px!important;padding:7px!important}
}
html.cwIntroFlowFamily #visual.cwCompactBirth #birthFrequencyCanvas{display:block;width:100%;max-height:68px;margin-top:5px;border:1px solid #234d80;border-radius:8px}
