/* Graphic icons share one stroke system, independent of emoji fonts. */
.ui-icon {
  display: inline-block;
  width: 1em;
  height: 1em;
  flex: 0 0 auto;
  vertical-align: -.15em;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.header-contact > span, .button > span, .text-link > span,
.scroll-cue > span, .work-info > span, .service-arrow,
.faq-list summary > span, .back-top > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  line-height: 1;
}
.close-dialog { display: grid; place-items: center; }
.close-dialog .ui-icon { width: 19px; height: 19px; }
.faq-list summary > span { width: 24px; height: 24px; }
.faq-list summary .ui-icon { width: 20px; height: 20px; }
.play-mark .ui-icon { width: 18px; height: 18px; margin: 0; }
.faq-cta > .ui-icon, .dialog-footer a > .ui-icon,
.work-footnote .ui-icon { width: 16px; height: 16px; margin-left: 4px; }