.gvl-art {
  display: inline-flex;
  width: 100%;
  aspect-ratio: 1;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: 14px;
  background: #f2f8fa;
  color: #173e5b;
}
.gvl-art svg,
.gvl-art img {
  display: block;
  width: 88%;
  height: 88%;
  object-fit: contain;
}
.gvl-art img {
  width: 96%;
  height: 96%;
  border-radius: 9px;
}
.gvl-small { border-radius: 8px; }
.gvl-photo { background: #fff; border: 1px solid #cbd8de; }
.gvl-teal { background: #e1f5f1; }
.gvl-violet { background: #efe9f9; }
.gvl-amber { background: #fff2d8; }
.gvl-coral, .gvl-salmon { background: #fff0e7; }
.gvl-blue { background: #e6f2fc; }
.gvl-pink { background: #fff0f7; }
.gvl-green { background: #eff8e3; }
.gvl-brown { background: #f3e8dc; }
.gvl-navy { background: #e9f0f4; }
@media (prefers-color-scheme: dark) {
  .gvl-art { color: #e7f7ff; }
  .gvl-photo { background: #fff; border-color: #60737d; }
}