.game-history-modal { box-sizing: border-box; display: flex; flex-direction: column; width: min(960px,calc(100% - 32px)); max-width: 960px; height: min(760px,calc(100dvh - 32px)); padding: 0; overflow: hidden; border-radius: 6px; animation: none; transform: none; font-size: 13px; }
.game-history-modal .modal-header { flex-shrink: 0; margin: 0; padding: 14px 18px; font-size: 19px; }
.game-history-modal button { font: inherit; color: #ddd; background: #363636; border: 1px solid #505050; border-radius: 4px; padding: 6px 10px; cursor: pointer; }
.game-history-modal button:hover { background: #444; }
.game-history-modal button:disabled { opacity: .4; cursor: default; }
.game-history-modal .game-history-close { padding: 0; width: 30px; height: 30px; border: 0; background: transparent; font-size: 25px; line-height: 1; }
.game-history-controls { display: grid; grid-template-columns: minmax(0,1fr) 160px auto; align-items: end; gap: 10px; padding: 12px 18px; border-bottom: 1px solid #444; flex-shrink: 0; }
.game-history-modal input, .game-history-modal select { box-sizing: border-box; min-width: 0; padding: 7px 9px; margin: 0; border: 1px solid #555; border-radius: 4px; color: #eee; background: #333; font: inherit; color-scheme: dark; }
.game-history-controls label { font-size: 12px; font-weight: normal; margin: 0 0 6px; color: #bbb; }
.game-history-search-field, .game-history-filter-field { min-width: 0; }
.game-history-search-box { position: relative; }
#game-history-search { appearance: none; display: block; width: 100%; height: 34px; padding-right: 56px; }
#game-history-search::placeholder { color: #999; opacity: 1; }
#game-history-search::-webkit-search-decoration, #game-history-search::-webkit-search-cancel-button { appearance: none; }
.game-history-modal #game-history-clear-search { position: absolute; right: 5px; top: 4px; height: 26px; padding: 0 6px; border: 0; color: #bbb; background: transparent; font-size: 11px; }
#game-history-filter, #game-history-import { width: 100%; height: 34px; }
.game-history-body { display: grid; grid-template-columns: minmax(220px,.8fr) minmax(0,1.2fr); flex: 1; min-height: 0; }
.game-history-scroll { overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #555 #292929; scrollbar-gutter: stable; }
.game-history-scroll::-webkit-scrollbar { width: 8px; }
.game-history-scroll::-webkit-scrollbar-thumb { background: #555; border-radius: 4px; }
#game-history-list { padding: 12px; border-right: 1px solid #444; }
.game-history-modal .game-history-item { display: flex; flex-direction: column; align-items: stretch; text-align: left; width: 100%; gap: 5px; padding: 10px; margin-bottom: 8px; overflow-wrap: anywhere; }
.game-history-item[aria-current=true] { border-color: #aaa; background: #404040; }
.game-history-item span, .game-history-item small, .game-history-muted { color: #aaa; }
.game-history-item small { font-size: 11px; line-height: 1.5; }
#game-history-detail { padding: 16px 18px; min-width: 0; }
.game-history-modal h3 { margin: 0 0 12px; font-size: 14px; }
.game-history-rename { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 7px; margin-bottom: 16px; }
.game-history-rename label { grid-column: 1/-1; color: #aaa; font-size: 12px; }
.game-history-info { display: grid; grid-template-columns: 65px minmax(0,1fr); gap: 8px 12px; line-height: 1.5; }
.game-history-info dt { color: #999; }
.game-history-info dd { margin: 0; overflow-wrap: anywhere; }
.game-history-actions { display: flex; gap: 6px; flex-wrap: wrap; margin: 16px 0; }
.game-history-analysis { border-top: 1px solid #444; border-bottom: 1px solid #444; padding: 14px 0; margin: 14px 0; }
.game-history-analysis select { width: 100%; margin-bottom: 10px; }
.game-history-moves { display: flex; flex-wrap: wrap; align-content: flex-start; gap: 5px; max-height: 180px; }
.game-history-moves button { font-size: 12px; padding: 4px 7px; }
.game-history-modal .modal-footer { display: flex; align-items: center; gap: 12px; padding: 10px 18px; border-top: 1px solid #444; margin: 0; flex-shrink: 0; }
#game-history-count { margin-right: auto; color: #999; font-size: 11px; }
#game-history-error { color: #e6a789; padding: 8px 18px; border-top: 1px solid #444; overflow-wrap: anywhere; flex-shrink: 0; }
#game-history-error[hidden] { display: none; }
#btn-game-history.unsaved { outline: 1px solid #d79d60; }
.game-history-modal :focus-visible { outline: 2px solid #aaa; outline-offset: 2px; }
@media(max-width:600px) {
    .game-history-modal { width: calc(100% - 16px); height: calc(100dvh - 16px); }
    .game-history-controls { padding: 10px 12px; grid-template-columns: minmax(0,1fr) auto; }
    .game-history-search-field { grid-column: 1/-1; }
    .game-history-body { grid-template-columns: minmax(0,1fr); grid-template-rows: minmax(100px,30%) minmax(0,1fr); }
    #game-history-list { border-right: 0; border-bottom: 1px solid #444; }
    #game-history-detail { padding: 12px; }
}
