/* ── Result cards ── */
.results-section {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.results-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.result-card {
  padding: 14px 16px;
  border-radius: 8px;
  background: #141412;
  border: 1px solid #222220;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.result-card--highlight {
  background: linear-gradient(135deg, #1e2018, #1a1c14);
  border: 1px solid #3a4020;
}

.result-card__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.result-card__badge {
  font-size: 9px;
  color: var(--text-dim);
}

.result-card__value {
  font-size: 22px;
  font-family: var(--font-body);
  font-weight: 600;
  letter-spacing: -0.02em;
}

.result-card__value.positive { color: var(--green); }
.result-card__value.zero { color: var(--text-muted); }
.result-card__value.negative { color: var(--red); }

/* ── Break-even cards ── */
.break-even-row {
  display: flex;
  gap: 8px;
  margin-top: 4px;
  grid-column: 1 / -1;
}

.break-even-card {
  flex: 1;
  padding: 10px 12px;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.break-even-card--amber {
  background: linear-gradient(135deg, #1a1814, #1c1a14);
  border: 1px solid var(--amber-subtle);
}

.break-even-card--green {
  background: linear-gradient(135deg, #141e14, #161c14);
  border: 1px solid var(--green-subtle);
}

.break-even-card__values {
  display: flex;
  align-items: baseline;
  gap: 6px;
  flex-wrap: wrap;
}

.break-even-card__primary {
  font-size: 20px;
  font-family: var(--font-body);
  font-weight: 700;
}

.break-even-card--amber .break-even-card__primary { color: var(--amber); }
.break-even-card--green .break-even-card__primary { color: var(--green); }

.break-even-card__secondary {
  font-size: 11px;
  font-family: var(--font-mono);
  font-weight: 500;
  opacity: 0.7;
}

.break-even-card--amber .break-even-card__secondary { color: var(--amber-dark); }
.break-even-card--green .break-even-card__secondary { color: var(--green-dark); }

/* ── Margin bar ── */
.margin-bar {
  padding: 10px 16px;
  border-radius: 8px;
  background: #131312;
  border: 1px solid #1e1e1c;
}

.margin-bar__header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 4px;
}

.margin-bar__percent {
  font-size: 16px;
  font-family: var(--font-body);
  font-weight: 600;
  letter-spacing: -0.02em;
}

.margin-bar__percent.positive { color: var(--green); }
.margin-bar__percent.zero { color: var(--text-muted); }
.margin-bar__percent.negative { color: var(--red); }

.margin-bar__track {
  height: 4px;
  border-radius: 2px;
  background: var(--surface-raised);
  overflow: hidden;
}

.margin-bar__fill {
  height: 100%;
  border-radius: 2px;
  transition: width 0.3s ease, background 0.3s ease;
}

.margin-bar__fill.high { background: var(--green); }
.margin-bar__fill.mid { background: #c8d060; }
.margin-bar__fill.low { background: var(--amber); }
.margin-bar__fill.none { background: var(--red); }