ul.skill-list {
  padding: 0; }

.skill-display {
  display: flex;
  text-align: left; }

.skill-proficiency {
  flex: 1; }

.skill-modifier {
  flex: 2;
  text-align: right;
  padding-right: .75em; }

.skill-name {
  flex: 8; }

.related-ability {
  flex: 3;
  color: var(--black); }

button {
  background-color: var(--secondary-color);
  border: none;
  padding: var(--spacing-medium) var(--spacing-large);
  margin: var(--spacing-small);
  clip-path: polygon(100% 0, 30% 0, 0 100%, 70% 100%); }

button.btn-danger {
  background-color: var(--error-color); }

.text-field {
  display: block;
  text-align: left;
  margin: var(--spacing-medium); }

.text-field label {
  display: block; }