.ds-workspace {
  min-height: 100vh;
  background:
    radial-gradient(circle at 88% -10%, rgba(37, 99, 235, .32), transparent 34rem),
    linear-gradient(180deg, var(--ds-color-bg) 0%, var(--ds-color-bg-deep) 100%);
  color: var(--ds-color-text);
  font-family: var(--ds-font-family);
}

.ds-workspace *,
.ds-workspace *::before,
.ds-workspace *::after {
  box-sizing: border-box;
}

.ds-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.ds-workspace :where(a, button, input, select, textarea):focus-visible {
  outline: 2px solid #60a5fa;
  outline-offset: 2px;
  box-shadow: var(--ds-shadow-focus);
}

.ds-workspace button,
.ds-workspace input,
.ds-workspace select,
.ds-workspace textarea {
  font: inherit;
}

@media (prefers-reduced-motion: reduce) {
  .ds-workspace *,
  .ds-workspace *::before,
  .ds-workspace *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}