/* 焦平面 · 本实验自己的一点样式。其余全部来自 /lab/shared/shell.css（LAB-TEMPLATE v1）。 */
#stage { position: fixed; inset: 0; }
#stage canvas { display: block; }
#nogl { position: fixed; inset: 0; display: grid; place-items: center; padding: 24px; z-index: 30; background: var(--lt-bgTop, #0d131f); }
#nogl[hidden] { display: none; }
#nogl h2 { font-size: 18px; margin: 0 0 8px; }
#nogl p { color: #9aa6b8; max-width: 420px; line-height: 1.6; margin: 0; }
#loading { position: fixed; inset: 0; display: grid; place-items: center; z-index: 20; background: var(--lt-bgTop, #0d131f); color: #9aa6b8; font-size: 14px; transition: opacity .4s; }
#loading.done { opacity: 0; pointer-events: none; }

/* subject names in the one-line explanation carry their light's colour (PLAN.md 调色板) */
.lt-now b.c-near { color: #ff8a3d; }
.lt-now b.c-mid { color: #2fe3b4; }
.lt-now b.c-far { color: #b9a4ff; }
.lt-now .n { font-family: var(--lt-mono); }
.lt-now .nw { white-space: nowrap; }

/* the camera's picture (taking camera, in the info card) */
.pf-thumb-wrap { position: relative; }
.pf-thumb-wrap canvas.pf-thumb { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; border-radius: 10px; background: #0a0e16; box-shadow: inset 0 0 0 1px rgba(243, 245, 249, 0.12); }
.pf-thumb-cap { margin-top: 6px; font-size: 11.5px; color: var(--lt-textDim, #9aa6b8); }

@media (max-width: 699px) {
  /* template r2: a shorter card, so the lens, the focal plane and the scene get ≥ 60 % of the screen height —
     the camera's picture sits beside the one-line explanation (its caption repeats the readouts, so it goes) */
  .lt-card { display: grid; grid-template-columns: minmax(0, 1fr) 128px; column-gap: 10px; align-items: center; }
  .lt-card > h1, .lt-card > .lt-readouts { grid-column: 1 / -1; }
  .lt-card > .lt-now { grid-column: 1; }
  .lt-card > .lt-chart { grid-column: 2; margin-top: 0; }
  .pf-thumb-wrap canvas.pf-thumb { width: 128px; max-height: none; margin: 0; }
  .pf-thumb-cap { display: none; }
  .lt-scenarios button { font-size: 13px; }
}