.unit-section {
  display: flex;

  overflow: scroll;
  overflow-x: hidden;

  flex: 1;

  flex-direction: column;
  row-gap: min(10px, calc(10 * 0.1667vh));

  border-radius: min(20px, calc(20 * 0.1667vh));

  padding: min(12px, calc(12 * 0.1667vh));;
  background: linear-gradient(
    145deg,
    #020617 0%,
    #0b1120 45%,
    #1e293b 100%
  );
  border: 1px solid rgba(96, 165, 250, 0.5);
  position: relative;
}

.stat-potential-tabs {
  display: flex;

  flex-direction: row;
  column-gap: min(6px, calc(6 * 0.1667vh));

  padding: min(0px, calc(0 * 0.1667vh));

  border-radius: min(20px, calc(20 * 0.1667vh));
}

.percent-symbol {
  font-size: max(18px, calc(18vh/12))
}

.aoe-info {
  display: flex;

  flex-wrap: wrap;

  row-gap: min(6px, calc(6 * 0.1667vh));

  flex-direction: row;
  column-gap: min(6px, calc(6 * 0.1667vh));

  align-items: center;
}

.base-stats {
  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: min(16px, calc(16 * 0.1667vh));

  border-radius: min(16px, calc(16 * 0.1667vh));
  padding: min(12px, calc(12 * 0.1667vh));

  background-color: rgba(0, 0, 0, 0.3);
}

.base-stat {
  display: flex;

  width: 100%;

  flex-direction: row;
  align-items: center;

  justify-content: space-between;
}

.unit-section::before,
.buffs-section::before,
.stat-section::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: min(3px, calc(3 * 0.1667vh));
  border-radius: min(20px, calc(20 * 0.1667vh)) min(20px, calc(20 * 0.1667vh)) 0 0;
  background: linear-gradient(
    90deg,
    var(--color-accent-soft, #6366f1),
    var(--color-accent, #a855f7)
  );
}

/* Inner grouping cards to break up large dark areas on calculator page */
body.calculator-page .unit-section .base-stats,
body.calculator-page #passive-container {
  background-color: rgba(15, 23, 42, 0.96);
  border-radius: min(16px, calc(16 * 0.1667vh));
  border: 1px solid rgba(30, 64, 175, 0.7);
}

.stat-label {
  display: flex;

  gap: min(6px, calc(6 * 0.1667vh));

  align-items: center;
  justify-self: flex-start;
}

.passive-description {
  font-size: max(20px, calc(20vh/12)) !important;
}