/* Step Y / V16 — legible, compact lesson 8+9 classroom and no markers on photos.
 * Scoped to lessons 8 and 9: other lessons, authentication and stored data untouched.
 */
:is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]).classroom-stage-ready .play-area {
  grid-template-columns: clamp(220px, 20vw, 290px) minmax(0, 1fr) !important;
}
:is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) .lesson-criteria {
  justify-content: flex-start !important;
  align-content: start !important;
  align-items: stretch;
  align-self: stretch !important;
  justify-self: stretch !important;
  width: 100% !important;
  box-sizing: border-box !important;
  overflow-x: hidden !important;
  overflow-y: auto !important; /* safety fallback: never cut off a criterion */
  padding: clamp(10px, 1.3vw, 19px) clamp(14px, 1.35vw, 22px) !important;
  scrollbar-width: thin;
  background: #f9faf7;
}
:is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) .lesson-criteria-overline { display: none !important; }
:is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) .lesson-criteria h2 {
  font-size:clamp(23px,2vw,31px) !important;
  letter-spacing:-.05em;
  margin:0 0 10px !important;
  padding:0 0 8px;
}
:is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) .lesson-criteria .lesson-criterion {
  flex:0 0 auto;
  gap:2px;
  padding:clamp(5px,.65vw,10px) 0 !important;
}
:is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) .lesson-criteria .criterion-kicker {
  font-size: clamp(12px, 1.05vw, 16px) !important;
  line-height:1.28;
}
:is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) .lesson-criteria .lesson-criterion strong {
  font-size:clamp(32px,2.75vw,44px) !important;
  line-height:1.06;
}
:is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) .lesson-criteria .criterion-note {
  font-size:clamp(10px,.85vw,12px);
  line-height:1.3;
  word-break:keep-all;
}
:is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) .lesson-criteria .criterion-live strong {
  font-size:clamp(32px,2.75vw,44px) !important;
}
:is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) .criteria-conclusion,
:is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) .criteria-disclaimer {
  display:none !important; /* three prominent criteria suffice */
}
/* Remove the decorative cyan overlay panes (the underlying photo already has
   its own windows). The remaining blind fabric changes with each B state. */
:is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) #scene-mount svg[data-photo-scene="true"] #windows polygon {
  fill: none !important;
  stroke:none !important;
}
:is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) #scene-mount svg[data-photo-scene="true"] #weather-panes {
  display:none !important;
}
/* No B1–B4 labels, grab-bars, or visible interaction hit boxes on the image.
   The distinct B buttons and chooser in the bottom action row stay usable. */
:is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) #scene-mount svg[data-photo-scene="true"] :is(#spatial-labels, .blind-drag-grip, .blind-hotspot, .light-hotspot) {
  display:none !important;
}
:is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) #labels-toggle { display:none !important; }
:is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) .blind-popover { z-index:60; }
/* Make the main photograph visually fill the available stage as much as the
   4:3 coordinate space safely permits, without cropping out the controls. */
:is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) .play-area #scene-mount {
  background:linear-gradient(90deg,#e1e9e4,#f1f4f0 36%,#e2e9e5);
}
:is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) #scene-mount svg[data-photo-scene="true"] {
  width: min(100%, 1100px) !important;
  box-shadow:none !important;
}
@media(min-width:781px) and (max-height:820px) {
 :is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) .lesson-criteria {
   padding-top:8px !important;
   padding-bottom:8px !important;
 }
 :is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) .lesson-criteria h2 {
   font-size:26px !important;
   margin-bottom:3px !important;
 }
 :is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) .lesson-criteria .lesson-criterion {
   padding:4px 0 !important;
 }
 :is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) .lesson-criteria .lesson-criterion strong {
   font-size:34px !important;
 }
}
@media(max-width:780px) {
 :is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]).classroom-stage-ready .play-area {
   grid-template-columns:1fr !important;
   grid-template-rows:115px minmax(0,1fr) !important;
 }
 :is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) .lesson-criteria {
   display:grid !important;grid-template-columns:.68fr repeat(3,minmax(0,1fr)) !important;
   align-items:center;gap:6px !important;padding:6px 9px !important;
   overflow:hidden !important;
 }
 :is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) .lesson-criteria h2 {
   grid-column:1;font-size:20px !important;padding:0;margin:0 !important;
 }
 :is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) .lesson-criteria .lesson-criterion {
   padding:0 !important;border:0;gap:1px;
 }
 :is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) .lesson-criteria .criterion-kicker {font-size:10px !important}
 :is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) .lesson-criteria .lesson-criterion strong,
 :is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) .lesson-criteria .criterion-live strong {
   font-size:27px !important;
 }
 :is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) .lesson-criteria .criterion-note {font-size:10px !important}
 :is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) .criteria-conclusion,
 :is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) .criteria-disclaimer {display:none !important}
}
@media (max-width:820px) {
  /* On tablets, no hidden B2/B3/B4 controls off the right edge. */
  :is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) .classroom-action-bar {
    overflow-x:visible !important;
    min-height:99px;
    padding:5px 8px !important;
  }
  :is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) .classroom-action-bar .experiment-dock {
    flex-wrap:wrap !important;
    justify-content:center !important;
    align-content:center !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    gap:5px 10px !important;
    margin:0 auto !important;
  }
  :is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) .classroom-action-bar .dock-divider {display:none !important}
  :is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) .classroom-action-bar .dock-label {font-size:11px !important}
  :is(.sim-shell[data-lesson="8"], .sim-shell[data-lesson="9"]) .classroom-action-bar :is(.switch-chip,.blind-chip,.desk-visual-toggle,.reset-control) {
    min-height:38px !important;height:38px !important;
  }
}