.projection-history-number {
  appearance: none; border: 0; border-bottom: 1px dotted currentColor; border-radius: 0;
  background: transparent; color: inherit; font: inherit; font-weight: 700;
  padding: 2px 0; cursor: pointer; min-width: 2ch;
}
.projection-history-number:hover, .projection-history-number:focus-visible { color: var(--accent); }
.projection-history-number:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }
.projection-history-popover {
  position: fixed; inset: auto; margin: 0; box-sizing: border-box; padding: 16px;
  border: 1px solid var(--line, #bbb7ad); border-radius: 12px;
  background: var(--surface, #fffdf8); color: var(--text, #edf2f8);
  box-shadow: 0 12px 40px #0006; z-index: 10000; max-height: calc(100dvh - 24px); overflow: auto;
}
.projection-history-popover header, .player-projection-history > header {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
}
.projection-history-popover header { flex-wrap: nowrap; margin-bottom: 12px; }
.projection-history-popover header button { background: transparent; color: inherit; border: 0; font-size: 24px; padding: 0 8px; min-height: 36px; }
.projection-history-summary { display: flex; gap: 12px; flex-wrap: wrap; justify-content: space-between; align-items: baseline; }
.projection-history-summary strong { font-size: 24px; }
.projection-history-summary small, .projection-history-summary span { font-size: 12px; font-weight: 400; }
.projection-history-chart { width: 100%; height: auto; display: block; max-height: 320px; margin-top: 12px; overflow: visible; }
.projection-history-chart text { fill: currentColor; font-size: 11px; opacity: .8; }
.projection-history-grid { stroke: currentColor; opacity: .15; }
.projection-history-line { fill: none; stroke: var(--accent, #65dcb0); stroke-width: 2; }
.projection-history-dot { fill: var(--accent, #65dcb0); }
.projection-history-note, .projection-history-empty { font-size: 13px; line-height: 1.5; opacity: .8; margin: 10px 0 0; }
.projection-history-values .table-wrap { max-height: 260px; overflow: auto; }
.player-projection-history { min-width: 0; }
.player-projection-history label { display: flex; align-items: center; gap: 8px; }
@media (max-width: 600px) {
  .projection-history-number { min-height: 32px; }
  .projection-history-popover { padding: 12px; }
  .player-projection-history > header { align-items: flex-start; }
}

.game-history-actual { stroke: var(--accent); }
.projection-history-chart circle.game-history-actual { fill: var(--accent); }
.projection-history-chart circle.game-history-projected { fill: var(--amber); }
.game-history-projected { stroke: var(--amber); stroke-dasharray: 5 3; }
.game-history-legend { display: flex; flex-wrap: wrap; gap: 16px; font-size: .8rem; }
.game-history-legend span:first-child { color: var(--accent); }
.game-history-legend span:last-child { color: var(--amber); }