/* Local comparison accents follow the site's ivory/lavender and plum themes.
   SVG colors are CSS variables: switching theme needs no data fetch or redraw. */
#historyPanel{
 --history-a:var(--primary);--history-b:#AF4F73;
 --history-a-soft:color-mix(in srgb,var(--history-a) 7%,var(--surface));
 --history-b-soft:color-mix(in srgb,var(--history-b) 7%,var(--surface));
 --history-min:#706083;--history-max:#946329;--history-marker-ink:#FFFFFF;
 --history-shade-opacity:.12;--history-missing-opacity:.08;--history-tip-shadow:0 8px 28px #30213b24;
 border-top:3px solid var(--primary)!important;color:var(--text);
}
:root[data-theme="dark"] #historyPanel{
 --history-b:#E6A0BB;--history-min:#BAA8D5;--history-max:#E1BC84;--history-marker-ink:#281F32;
 --history-shade-opacity:.18;--history-missing-opacity:.12;--history-tip-shadow:0 8px 32px #00000060;
}
.history-panel [hidden]{display:none!important}
.history-toolbar{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:20px 0 14px}
.history-presets{display:flex;gap:6px}.history-panel button{min-height:42px;cursor:pointer}
#historyPanel .history-presets button{padding:8px 15px;border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--muted)}
#historyPanel .history-presets button:hover{background:var(--control-hover);color:var(--primary);border-color:var(--primary)}
#historyPanel .history-presets button[aria-pressed=true]{background:var(--control-active);color:var(--on-active);border-color:var(--control-active)}
#historyPanel #historyLoad{background:var(--button-brand,var(--primary));color:var(--button-brand-ink,var(--on-active));border:1px solid transparent;border-radius:9px;padding:9px 18px}
#historyPanel #historyLoad:hover{background:var(--button-brand-hover,var(--primary-strong))}
.history-controls{display:flex;gap:12px;flex-wrap:wrap}
.history-controls label,.history-month-label{display:grid;gap:6px;font-size:13px;color:var(--muted)}
#historyPanel .history-controls input,#historyPanel .history-controls select,#historyPanel .history-month-label select{font:inherit;min-height:42px;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--text);padding:8px;max-width:100%;box-sizing:border-box}
.history-controls label:last-child{flex:1;min-width:190px}
.history-legend{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px}
.history-home{border:1px solid color-mix(in srgb,var(--history-a) 20%,var(--line));border-left:4px solid var(--history-a);background:var(--history-a-soft);color:var(--text);border-radius:10px;padding:12px;min-width:0;overflow-wrap:anywhere}
.history-home.history-b{border-color:color-mix(in srgb,var(--history-b) 20%,var(--line));border-left-color:var(--history-b);background:var(--history-b-soft)}
.history-home strong,.history-home small{display:block}
.history-home strong{color:var(--history-a)}.history-home.history-b strong{color:var(--history-b)}
.history-home small{margin-top:6px;color:var(--muted);font-size:12px;line-height:1.6}
.history-metric{font-weight:600;font-size:14px;line-height:1.6;color:var(--text)}
.history-chart{max-width:100%}.history-chart svg{width:100%;height:auto;display:block;overflow:visible}
.history-chart circle{cursor:pointer;stroke:var(--surface);stroke-width:1.5px}
.history-chart circle:focus{outline:3px solid var(--primary)}
.history-chart text{font-family:inherit;fill:var(--muted);font-size:12px}
.history-coverage{font-size:13px;color:var(--muted);line-height:1.7;background:color-mix(in srgb,var(--surface-strong) 65%,var(--surface));border:1px solid var(--line);padding:12px;border-radius:10px}
.history-month-label{max-width:290px;margin:20px 0 12px}
.history-trade-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.history-trade-grid article{min-width:0;border:1px solid var(--line);background:var(--surface);border-radius:10px;padding:12px}
.history-trade-grid h4{margin:0 0 8px;color:var(--text)}.history-trade-scroll{overflow:auto;max-height:350px}
.history-trade-grid table{width:100%;border-collapse:collapse;font-size:12px;white-space:nowrap;color:var(--text)}
.history-trade-grid th,.history-trade-grid td{padding:8px 5px;border-bottom:1px solid var(--line);text-align:left}
.history-trade-grid p,.history-method{font-size:13px;line-height:1.7;color:var(--muted)}
.history-disclaimer{font-size:12px;color:var(--muted);line-height:1.6;margin-top:20px}
.history-method summary{font-size:13px!important;font-weight:400!important}.history-method p{max-width:80ch}
.history-panel button:disabled{opacity:.5;cursor:wait}
.history-extremes{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:16px 0 8px}
#historyPanel .history-extreme-card{--extreme:var(--history-min);display:grid;gap:5px;text-align:left;padding:14px 16px;border:1px solid color-mix(in srgb,var(--extreme) 26%,var(--line));border-radius:12px;background:color-mix(in srgb,var(--extreme) 6%,var(--surface));color:var(--extreme);font:inherit;cursor:pointer}
#historyPanel .history-extreme-wide{--extreme:var(--history-max)}
#historyPanel .history-extreme-card:hover{background:color-mix(in srgb,var(--extreme) 11%,var(--surface));border-color:var(--extreme)}
#historyPanel button:focus-visible,#historyPanel input:focus-visible,#historyPanel select:focus-visible{outline:2px solid var(--primary);outline-offset:3px}
.history-extreme-card span{font-size:13px;font-weight:700}.history-extreme-card strong{font-size:24px;line-height:1.2;letter-spacing:-.03em}
.history-extreme-card small{font-size:12px;line-height:1.6;color:var(--muted)}
.history-extreme-note{font-size:12px;line-height:1.65;color:var(--muted);margin:8px 0 12px}
.history-extreme-marker{cursor:pointer}
.history-chart .history-extreme-label{fill:var(--history-marker-ink);font-weight:700;font-size:11px}
.history-chart .history-extreme-ring{stroke:var(--history-min);stroke-width:2px;fill:var(--surface)}
.history-chart .history-extreme-marker[data-kind="wide"] .history-extreme-ring{stroke:var(--history-max)}
.history-plot{position:relative}.history-plot svg:focus-visible{outline:2px solid var(--primary);outline-offset:3px;border-radius:8px}
.history-hover{position:absolute;top:45px;z-index:3;width:260px;max-width:calc(100% - 12px);box-sizing:border-box;padding:13px 15px;background:var(--surface);color:var(--text);border:1px solid var(--line);border-radius:12px;box-shadow:var(--history-tip-shadow);pointer-events:none;font-size:13px;line-height:1.55}
.history-hover>strong{display:block;margin-bottom:9px}.history-hover>div{display:grid;margin:7px 0}
.history-hover b{font-size:12px;overflow-wrap:anywhere}.history-hover-a b{color:var(--history-a)}.history-hover-b b{color:var(--history-b)}
.history-hover span{font-size:14px;font-weight:700}.history-hover p{margin:10px 0 0;padding-top:8px;border-top:1px solid var(--line);font-weight:700}
.history-hover small{display:block;margin-top:5px;color:var(--muted)}
.history-hover-crosshair{stroke:var(--primary);stroke-dasharray:3 3;stroke-width:1}
.history-chart #historyHoverMark circle{stroke:var(--primary);stroke-width:2;fill:var(--surface)}
.history-gap-band{fill:var(--history-a);fill-opacity:var(--history-shade-opacity);pointer-events:none}
.history-gap-band--missing{fill-opacity:var(--history-missing-opacity)}.history-connector{stroke-linecap:round;pointer-events:none}
.history-connector--missing{opacity:.85}.history-chart-key{font-size:12px;line-height:1.7;color:var(--muted);margin:8px 0 16px}
@media(max-width:600px){
 .history-legend,.history-trade-grid{grid-template-columns:1fr}.history-controls label{flex:1;min-width:120px}
 #historyPanel .history-presets button{padding:8px 12px}.history-chart{margin-left:-10px;margin-right:-5px}
 .history-panel{padding:16px!important}.history-home{padding:10px}
 #historyPanel .history-extreme-card{padding:12px 10px}.history-extreme-card strong{font-size:21px}
 .history-extremes{gap:8px}.history-hover{width:244px;font-size:12px;padding:11px}
}