h1 {
  font: var(--x-display-font);
  letter-spacing: var(--x-display-letter-spacing);
  color: var(--x-swatch-gray-200);
  margin: 0 0 var(--x-margin-small) 0;
}

h2 {
  font: var(--x-caption-font);
  font-weight: var(--x-bold-font-weight);
  text-transform: uppercase;
  letter-spacing: var(--x-caption-letter-spacing);
  color: var(--x-swatch-gray-200);
  margin: var(--x-margin-medium) 0 var(--x-margin-xxsmall) 0;
}

#list {
  display: flex;
}

section + section {
  margin: 0 0 0 var(--x-margin-xxlarge);
}

ul {
  margin: 0;
  padding: 0;
  color: var(--x-swatch-gray-500);
  list-style-type: cjk-ideographic;
  list-style-type: none;
}

ul + ul {
  margin-top: var(--x-margin-large);
}

a {
  font: var(--x-subheading-font);
  color: var(--x-swatch-blue);
  text-decoration: none;
}

a:visited {
  color: var(--x-swatch-blue);
}

a:hover,
a:active {
  text-decoration: underline;
}

x-emoji {
  pointer-events: none;
}

x-emoji[huge] {
  display: inline-block;
  height: 160px;
  font-size: 10rem;
  line-height: 10rem;
  transform: scale(-1, 1);
  overflow: hidden;
  text-shadow: 0 1px 1px var(--x-swatch-blue);
}