.main {
  composes: box from '../components/Box.module.css';
  min-height: 222px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  position: relative;
}

.preferences {
  position: absolute;
  right: 5%;
  top: 1.5rem;
}

.preferences svg {
  fill: #8b98a9;
  transition: 0.2s ease-out;
  width: 1.25rem;
  height: 1.25rem;
}

:global(.dark) .preferences svg {
  fill: #8b98a9;
  opacity: 0.5;
}

.balanceWrap {
  display: grid;
  grid-gap: 0.5rem;
  grid-template-columns: repeat(auto-fit, minmax(7rem, 1fr));
  justify-items: start;
  width: 100%;
}