.arrange-mount {

  margin-bottom: var(--space-3);

}



.arrange-bar {

  display: flex;

  flex-wrap: wrap;

  gap: 0.4rem;

  align-items: center;

  padding: 0;

  border: 0;

  background: transparent;

}



.arrange-bar__label {

  font-family: var(--font-body);

  font-size: var(--text-xs);

  font-weight: 600;

  line-height: var(--leading-snug);

  letter-spacing: var(--tracking-label);

  text-transform: uppercase;

  color: var(--steel);

  margin-right: 0.2rem;

  margin-left: 0.35rem;

}



.arrange-bar__label:first-child {

  margin-left: 0;

}



.arrange-btn {

  padding: 0.35rem 0.65rem;

  border: 1px solid transparent;

  background: transparent;

  font-family: var(--font-body);

  font-size: var(--text-sm);

  font-weight: 500;

  line-height: 1.25;

  letter-spacing: 0;

  color: var(--ink-soft);

  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;

}



.arrange-btn:hover {

  color: var(--ink);

  border-color: var(--line);

}



.arrange-btn.is-active {
  background: var(--accent-soft);
  border-color: rgba(45, 212, 191, 0.35);
  color: var(--accent-bright);
  font-size: var(--text-sm);
  font-weight: 600;
}



.arrange-hint {

  display: none;

}



.arrange-hint:not(:empty) {

  display: block;

  width: 100%;

  font-family: var(--font-body);

  font-size: var(--text-sm);

  font-weight: 400;

  line-height: var(--leading-snug);

  letter-spacing: 0;

  color: var(--ink-soft);

  margin-top: 0.35rem;

}