/* Presentation polish around the WebGL model.
   Keep UI chrome, but stop recoloring the 3D scene like a sci-fi HUD. The WebGL lighting
   and material layer owns image color; do not add a CSS filter over the live canvas. */

.ambient {
  opacity: .12;
}

.scanline {
  opacity: .11;
  background-size: 100% 6px;
}

body.focus-line-a .scanline {
  opacity: .035;
}

/* The workbench should read equipment-first. Keep the information cards legible while
   returning more of the viewport to the actual rack and service aisle. */
body.focus-line-a .story-shell {
  left: 96px;
  top: 102px;
  bottom: 104px;
  width: min(370px, 32vw);
}

body.focus-line-a .story-card,
body.focus-line-a .detail-card {
  background: linear-gradient(145deg, rgba(8,16,20,.91), rgba(5,10,13,.84));
  border-color: rgba(162,208,218,.15);
}

body.focus-line-a .story-card {
  padding: 22px 23px 24px;
}

body.focus-line-a h1 {
  font-size: clamp(31px, 3.2vw, 48px);
  line-height: .98;
}

body.focus-line-a .story-copy {
  font-size: 13px;
  line-height: 1.58;
}

body.focus-line-a .detail-card {
  width: 294px;
}

body.focus-line-a .metric-strip {
  opacity: .78;
}

@media (max-width: 900px) {
  body.focus-line-a .story-shell {
    left: 24px;
    top: 90px;
    bottom: 122px;
    width: calc(100vw - 48px);
  }
  body.focus-line-a h1 { font-size: 38px; }
}
