.icon {
  background-repeat: no-repeat;
  text-align: center;
  position: relative;
  font-family: "Sandstone Icons";
  margin: 0.5rem;
  overflow: hidden;
  width: var(--icon-size, 1.625rem );
  height: var(--icon-size, 1.625rem );
  font-size: var(--icon-size, 1.625rem );
  line-height: var(--icon-size, 1.625rem );
  background-position: center 0;
  background-size: var(--icon-size, undefined 1.625rem ) calc(var(--icon-size,  1.625rem ) * 2);
}
.icon.large {
  --icon-size: 2.25rem;
}
.icon.medium {
  --icon-size: 1.875rem;
}
.icon.small {
  --icon-size: 1.625rem;
}
.icon.tiny {
  --icon-size: 1.25rem;
}
.icon.dingbat {
  font-family: "LG Icons";
}
.icon:global(.neutral) {
  color: inherit;
}
:global(.enact-a11y-high-contrast) .icon:global(.neutral):global(.highContrast) {
  color: inherit;
}
.icon:global(.light) {
  color: inherit;
}
.icon:global(.game) {
  color: inherit;
}
:global(.green) .icon:global(.game) {
  color: inherit;
}
:global(.orange) .icon:global(.game) {
  color: inherit;
}
:global(.spotlight-input-key) :global(.neutral) :global(.spottable):focus .icon,
:global(.spotlight-input-mouse) :global(.neutral) :global(.spottable):focus .icon {
  background-position: center 100%;
  color: inherit;
}
:global(.spotlight-input-touch) :global(.neutral) :global(.spottable):active .icon {
  background-position: center 100%;
  color: inherit;
}
:global(.spotlight-input-key) :global(.enact-a11y-high-contrast) :global(.neutral):global(.highContrast) :global(.spottable):focus .icon,
:global(.spotlight-input-mouse) :global(.enact-a11y-high-contrast) :global(.neutral):global(.highContrast) :global(.spottable):focus .icon {
  background-position: center 100%;
  color: inherit;
}
:global(.spotlight-input-touch) :global(.enact-a11y-high-contrast) :global(.neutral):global(.highContrast) :global(.spottable):active .icon {
  background-position: center 100%;
  color: inherit;
}
:global(.spotlight-input-key) :global(.light) :global(.spottable):focus .icon,
:global(.spotlight-input-mouse) :global(.light) :global(.spottable):focus .icon {
  background-position: center 100%;
  color: inherit;
}
:global(.spotlight-input-touch) :global(.light) :global(.spottable):active .icon {
  background-position: center 100%;
  color: inherit;
}
:global(.spotlight-input-key) :global(.game) :global(.spottable):focus .icon,
:global(.spotlight-input-mouse) :global(.game) :global(.spottable):focus .icon {
  background-position: center 100%;
  color: inherit;
}
:global(.spotlight-input-touch) :global(.game) :global(.spottable):active .icon {
  background-position: center 100%;
  color: inherit;
}
:global(.spotlight-input-key) :global(.green) :global(.game) :global(.spottable):focus .icon,
:global(.spotlight-input-mouse) :global(.green) :global(.game) :global(.spottable):focus .icon {
  background-position: center 100%;
  color: inherit;
}
:global(.spotlight-input-touch) :global(.green) :global(.game) :global(.spottable):active .icon {
  background-position: center 100%;
  color: inherit;
}
:global(.spotlight-input-key) :global(.orange) :global(.game) :global(.spottable):focus .icon,
:global(.spotlight-input-mouse) :global(.orange) :global(.game) :global(.spottable):focus .icon {
  background-position: center 100%;
  color: inherit;
}
:global(.spotlight-input-touch) :global(.orange) :global(.game) :global(.spottable):active .icon {
  background-position: center 100%;
  color: inherit;
}
