@import "https://assets.elements.dev/assets/app/shared/ui-catalog/catalog/style.c38e1d7304920e3.css";

.aspect-demo-wide {
  width:     100%;
  max-width: 28rem;
}

.aspect-demo-narrow {
  width:     100%;
  max-width: 12rem;
}

.aspect-ratio.aspect-demo-rounded {
  border-radius: var(--radius-surface);
  background:    var(--bg-muted);
}

.aspect-demo-caption {
  margin-top: var(--space-2);
  color:      var(--ink-dim);
  font-size:  var(--text-caption);
}

.aspect-demo-controls {
  display:   flex;
  flex-wrap: wrap;
  gap:       var(--space-2);
  margin-bottom: var(--space-3);
}

.aspect-demo-map {
  display:         grid;
  place-items:     center;
  border:          var(--surface-border-width) dashed var(--rule);
  border-radius:   inherit;
  color:           var(--ink-soft);
  font-size:       var(--text-ui);
}