.archive-intro { margin-bottom: 1.5rem; }
.archive-tabs { display: flex; flex-wrap: wrap; gap: .6rem; margin-bottom: 1rem; }
.archive-tabs button { padding: .7rem 1rem; border: 1px solid var(--border); border-radius: 8px; font: inherit; color: var(--primary); background: var(--surface-alt); cursor: pointer; }
.archive-tabs button[aria-pressed="true"] { background: var(--primary); color: white; }
#archive-stats-help { margin-bottom: 1rem; color: var(--muted); }
.archive-intro p { margin-top: .7rem; }
#archive-summary { color: var(--primary); font-weight: bold; }
.archive-filters { display: flex; flex-wrap: wrap; gap: 1rem; margin-bottom: 1rem; }
.archive-filters label { display: grid; gap: .4rem; flex: 1 1 240px; font-weight: bold; }
.archive-filters input, .archive-filters select { width: 100%; padding: .75rem; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); color: var(--text); font: inherit; }
.archive-help { color: var(--muted); font-size: .9rem; margin: .65rem 0 1rem; }
.archive-table-wrap { overflow: auto; max-height: 70vh; border: 1px solid var(--border); border-radius: 10px; }
:is(#archive-table, #archive-stats-table) { border-collapse: separate; border-spacing: 0; width: 100%; font-size: .95rem; }
:is(#archive-table, #archive-stats-table) caption { text-align: left; padding: .8rem; font-weight: bold; }
:is(#archive-table, #archive-stats-table) th, :is(#archive-table, #archive-stats-table) td { padding: .8rem 1rem; border-bottom: 1px solid var(--border); text-align: left; min-width: 190px; }
:is(#archive-table, #archive-stats-table) thead th { position: sticky; top: 0; background: var(--primary); color: white; z-index: 2; }
:is(#archive-table, #archive-stats-table) thead span { display: block; font-size: .8rem; font-weight: normal; margin-top: .25rem; }
:is(#archive-table, #archive-stats-table) tr > :first-child { position: sticky; left: 0; background: var(--surface); z-index: 1; min-width: 150px; border-right: 1px solid var(--border); }
:is(#archive-table, #archive-stats-table) thead tr > :first-child { background: var(--primary); z-index: 3; }
:is(#archive-table, #archive-stats-table) tbody tr:nth-child(even) > * { background: var(--surface-alt); }
:is(#archive-table, #archive-stats-table) .archive-total { min-width: 100px; text-align: center; font-weight: bold; }
.archive-missing { color: var(--muted); }
.archive-notes { margin-top: 1.2rem; color: var(--muted); }
.archive-notes summary { cursor: pointer; font-weight: bold; }
.archive-notes p { margin-top: .6rem; }
:is(.archive-filters input, .archive-filters select, .archive-table-wrap, .archive-notes summary):focus-visible { outline: 3px solid var(--primary-light); outline-offset: 3px; }
@media (max-width: 600px) { :is(#archive-table, #archive-stats-table) th, :is(#archive-table, #archive-stats-table) td { padding: .6rem; min-width: 160px; } :is(#archive-table, #archive-stats-table) tr > :first-child { min-width: 120px; } }

#archive-stats-table th, #archive-stats-table td { min-width: 100px; }
#archive-stats-table td strong { white-space: nowrap; font-family: monospace; font-size: 1.1rem; }

.archive-frequency { display: block; margin-top: .35rem; font-size: .85rem; color: var(--muted); }

#archive-table th, #archive-table td { min-width: 100px; }
#archive-table td strong { white-space: nowrap; }
.archive-game-history { min-width: 240px; }
.archive-game-history p { padding: .6rem 0; border-bottom: 1px solid var(--border); }
.archive-game-history strong { white-space: normal !important; }