:root {
  --design-url-favicon-ico: url("/roles/web-svc-html/latest/img/design/favicon.ico");
  --design-url-apple-touch-icon-png: url("/roles/web-svc-html/latest/img/design/apple-touch-icon.png");
  --design-url-apple-touch-icon-svg: url("/roles/web-svc-html/latest/img/design/apple-touch-icon.svg");
  --design-url-banner-png: url("/roles/web-svc-html/latest/img/design/banner.png");
  --design-url-banner-svg: url("/roles/web-svc-html/latest/img/design/banner.svg");
  --design-url-header-png: url("/roles/web-svc-html/latest/img/design/header.png");
  --design-url-header-svg: url("/roles/web-svc-html/latest/img/design/header.svg");
  --design-url-icon-png: url("/roles/web-svc-html/latest/img/design/icon.png");
  --design-url-icon-svg: url("/roles/web-svc-html/latest/img/design/icon.svg");
  --design-url-wordmark-png: url("/roles/web-svc-html/latest/img/design/wordmark.png");
  --design-url-wordmark-svg: url("/roles/web-svc-html/latest/img/design/wordmark.svg");
  --design-slot-apple-touch-icon-width: 180px;
  --design-slot-apple-touch-icon-height: 180px;
  --design-slot-banner-width: 960px;
  --design-slot-banner-height: 160px;
  --design-slot-header-width: 320px;
  --design-slot-header-height: 64px;
  --design-slot-icon-width: 512px;
  --design-slot-icon-height: 512px;
  --design-slot-wordmark-width: 320px;
  --design-slot-wordmark-height: 64px;
}
@layer infinito-design {
  body {
    margin: 0 auto;
    max-width: 40rem;
    padding: var(--design-space-6) var(--design-space-4);
  }

  hr {
    border: 0;
    border-top: 1px solid var(--design-border);
  }
}