/* 历史页的模型摘要在深色主题中维持足够对比度，避免继承浅色卡片文本。 */
.historyCard .suggestionPanel,
.historyCard .suggestionPanel .panel,
.historyCard .suggestionPanel .panelItem {
  background: #102f25 !important;
  color: #edf8f0 !important;
  border-color: rgba(177, 213, 196, .44) !important;
}

.historyCard .suggestionPanel :is(h2, h3, h4, strong, b, .ticket, .value) {
  color: #f5fff8 !important;
}

.historyCard .suggestionPanel :is(p, span, small, li, dt, dd, .label, .muted, .note) {
  color: #c6d9cd !important;
}

.historyCard .suggestionPanel :is(.good, .ok) { color: #8cebb1 !important; }
.historyCard .suggestionPanel :is(.warn, .warning) { color: #ffda85 !important; }
.historyCard .suggestionPanel :is(.bad, .error) { color: #ffaaa1 !important; }

.historyCard .suggestionPanel :is(.finalTop > div, .finalMetrics > div, .executionGrid > div) {
  background: rgba(7, 31, 20, .88) !important;
  border-color: rgba(177, 213, 196, .36) !important;
}

.historyCard .suggestionPanel :is(.vetoList > div, .reasonList > span) {
  background: rgba(7, 31, 20, .74) !important;
  color: #d5e6da !important;
}

.historyCard .suggestionPanel .hardRule {
  border-color: rgba(255, 170, 161, .62) !important;
  background: rgba(104, 29, 25, .24) !important;
}

.historyCard .suggestionPanel .softRule {
  border-color: rgba(255, 218, 133, .58) !important;
  background: rgba(105, 76, 18, .2) !important;
}

/* 历史预测筛选：与赛事画廊使用同一套圆润、可键盘操作的原生控件。 */
.historyToolbar {
  grid-template-columns: minmax(220px, 360px);
  gap: 12px;
  padding: 16px;
  border: 1px solid rgba(177, 213, 196, .32);
  border-radius: 22px;
  background: linear-gradient(135deg, rgba(24, 54, 38, .74), rgba(7, 24, 16, .88));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .045), 0 16px 38px rgba(0, 0, 0, .12);
}

.historyToolbar label {
  display: grid;
  gap: 8px;
  color: #b9d1c0;
  font-size: 13px;
  font-weight: 750;
  letter-spacing: .01em;
}

.historyToolbar label > span {
  color: inherit;
  font-size: inherit;
}

.historyToolbar select {
  width: 100%;
  min-height: 50px;
  height: 50px;
  padding: 0 48px 0 16px;
  -webkit-appearance: none;
  appearance: none;
  border: 1px solid rgba(201, 229, 210, .31);
  border-radius: 18px;
  outline: none;
  color: #f2fbf5;
  color-scheme: dark;
  background-color: rgba(3, 18, 10, .72);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m5.25 7.75 4.75 4.75 4.75-4.75' fill='none' stroke='%23d9eee0' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 17px center;
  background-size: 18px 18px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025);
  font: inherit;
  font-size: 16px;
  cursor: pointer;
  transition: border-color .2s var(--ease), box-shadow .2s var(--ease), background-color .2s var(--ease);
}

.historyToolbar select:hover {
  border-color: rgba(137, 225, 170, .58);
  background-color: rgba(6, 31, 18, .82);
}

.historyToolbar select:focus-visible {
  border-color: #7de8a5;
  box-shadow: 0 0 0 4px rgba(121, 232, 163, .18), inset 0 1px 0 rgba(255, 255, 255, .04);
}

.historyToolbar select option {
  background: #10271a;
  color: #f2fbf5;
}

.historyToolbar select option:checked {
  background: #285e3e;
  color: #fff;
}

@media (max-width: 640px) {
  .historyToolbar {
    grid-template-columns: 1fr;
    padding: 14px;
    border-radius: 18px;
  }

  .historyToolbar select {
    min-height: 52px;
    height: 52px;
    border-radius: 17px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .historyToolbar select { transition: none; }
}