.evolution-trace { border-top: 1px solid var(--border-color); }
.evolution-trace .memory-intro { max-width: none; }
.trace-interactive { border: 1px solid var(--border-color); border-radius: 20px; overflow: hidden; background: white; box-shadow: var(--shadow-sm); }
.trace-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; padding: 1rem 1.5rem; border-bottom: 1px solid var(--border-color); }
.trace-counter { font-size: .85rem; font-weight: 700; }
.trace-controls { display: flex; gap: .5rem; }
.trace-controls button { font: inherit; font-size: .8rem; font-weight: 600; padding: .5rem .85rem; border: 1px solid var(--border-color); border-radius: 8px; background: white; color: var(--text-primary); cursor: pointer; }
.trace-controls button:first-child { color: white; background: var(--primary-color); border-color: var(--primary-color); min-width: 74px; }
.trace-controls button:disabled { opacity: .45; cursor: default; }
.trace-stages { display: grid; grid-template-columns: repeat(3, 1fr); list-style: none; padding: 1rem 1.5rem; margin: 0; gap: .65rem; background: var(--background-secondary); }
.trace-stages li { font-size: .8rem; color: var(--text-secondary); border-bottom: 3px solid var(--border-color); padding: .3rem 0 .65rem; }
.trace-stages li.is-active { color: var(--result-ink); border-color: var(--primary-color); font-weight: 700; }
.trace-stages li.is-complete { color: #047857; border-color: #6ee7b7; }
.trace-body { display: grid; grid-template-columns: minmax(0, 1fr); }
[data-result="pass"] { color: #047857; }
[data-result="fail"] { color: #b91c1c; }
[data-result="skipped"], [data-result="pending"] { color: #64748b; }
.trace-figure { padding: 1.5rem 1.25rem; min-width: 0; }
.trace-figure svg { display: block; width: 100%; height: auto; overflow: visible; font-family: inherit; }
.trace-grid { stroke: #e2e8f0; stroke-width: 1; }
.trace-axis-label, .trace-axis-title { fill: #64748b; font-size: 11px; }
.trace-axis-title { font-weight: 500; }
.trace-line { fill: none; stroke: var(--ntu-red); stroke-width: 2.5; stroke-linejoin: round; }
.trace-commit { fill: white; stroke: var(--ntu-red); stroke-width: 2; }
.trace-score-label { fill: var(--result-ink); font-size: 11px; font-weight: 700; }
.trace-tag { fill: #facc15; stroke: #a16207; stroke-width: 1.5; }
.trace-rejected-link { stroke: #94a3b8; stroke-dasharray: 3 3; }
.trace-cross { stroke: #94a3b8; stroke-width: 2; fill: none; }
.trace-rejected-label { fill: #64748b; font-size: 10px; }
.trace-pending { fill: #fff7ed; stroke: #d97706; stroke-width: 2; }
.trace-pending-link { stroke: #d97706; stroke-dasharray: 4 4; }
.trace-pending-label { fill: #b45309; font-size: 11px; font-weight: 700; }
.trace-check-heading { font-size: .75rem; color: var(--text-secondary); margin: .5rem 0; }
.trace-checkpoints { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: .3rem; }
.trace-checkpoints button { display: grid; grid-template-rows: 1rem 1.5rem; justify-items: center; align-items: center; font: inherit; border: 1px solid var(--border-color); border-radius: 8px; background: #f8fafc; cursor: pointer; min-width: 0; padding: .3rem; }
.trace-checkpoints span { display: block; font-size: .65rem; line-height: 1; color: #64748b; }
.trace-checkpoints strong { display: flex; align-items: center; justify-content: center; height: 1.5rem; color: inherit; font-size: 1.2rem; line-height: 1; }
.trace-checkpoints button[aria-pressed="true"] { border-color: var(--ntu-red); box-shadow: 0 0 0 1px var(--ntu-red); }
.trace-legend { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: .5rem; margin-top: 1rem; font-size: .7rem; line-height: 1.25rem; color: #64748b; }
.trace-legend > span { display: inline-flex; align-items: center; justify-content: center; gap: .3rem; min-height: 1.25rem; white-space: nowrap; }
.trace-legend b { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 1em; font-size: .9rem; line-height: 1.25rem; }
.trace-legend .trace-blue { color: var(--ntu-red); }
.trace-legend .trace-gold { color: #a16207; }
.trace-promotion { padding: 1rem 1.5rem; border-top: 1px solid #a7f3d0; background: #ecfdf5; color: #065f46; font-size: .85rem; }
.trace-promotion strong { margin-right: .5rem; }
.evolution-trace .memory-table tbody tr:first-child { background: transparent; color: inherit; font-weight: inherit; }
.evolution-trace .memory-table tbody tr:last-child { background: #ecfdf5; color: #065f46; font-weight: 700; }
.trace-announcement { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@media (max-width: 768px) {
  .trace-toolbar { padding: 1rem; }
  .trace-controls { gap: .35rem; }
  .trace-controls button { padding: .5rem .65rem; }
  .trace-stages { padding: 1rem; gap: .5rem; }
  .trace-stages li { font-size: .7rem; }
  .trace-figure { padding: 1rem .75rem; }
}
@media (max-width: 600px) {
  .trace-legend { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 480px) {
  .trace-score-label, .trace-pending-label { font-size: 10px; }
  .trace-rejected-label { font-size: 9px; }
}