/* Vision — the camera surface. Base vocabulary is /themes/subapp/base.css; this file is the
   wall components. The palette is /themes/skins/ui-vision.css.

   The frame's hatch keeps its literal colours: it is the texture behind a missing video
   still, not a themed surface. */

.wall { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; }

.cam {
  display: block;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
}
.cam__frame {
  position: relative;
  aspect-ratio: 16 / 9;
  background: repeating-linear-gradient(135deg, #0b0d10 0 10px, #0e1116 10px 20px);
  display: grid;
  place-items: center;
  color: var(--muted);
  font-size: 12px;
}
.cam__frame img { width: 100%; height: 100%; object-fit: cover; }
.cam__state { position: absolute; top: 8px; left: 8px; }
.cam__foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 9px 11px; }
.cam__name { font-weight: 650; }
.cam__meta { color: var(--muted); font-size: 12px; }