.history-card-rich{position:relative;overflow:hidden;padding:1.2rem 0 0;box-shadow:0 18px 50px rgba(2,6,23,.08)}
.history-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding:0 1.2rem}
.history-change{text-align:right}.history-change span{display:block;color:var(--muted);font-size:.57rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase}.history-change strong{display:block;margin-top:.18rem;font-size:.95rem}.history-change.up strong{color:#ef4444}.history-change.down strong{color:#10b981}.history-change.flat strong{color:var(--muted)}
.history-chart-shell{position:relative;margin-top:.8rem;border-top:1px solid color-mix(in srgb,var(--border) 70%,transparent);background:linear-gradient(180deg,color-mix(in srgb,var(--energy-color) 4%,transparent),transparent 65%)}
.history-chart-scroll{overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--energy-color) 55%,var(--border)) transparent;overscroll-behavior-inline:contain;touch-action:pan-x;padding-bottom:.15rem}
.history-chart-scroll:focus-visible{outline:2px solid var(--energy-color);outline-offset:-2px}
.sparkline{display:block;max-width:none;height:260px;margin:0;overflow:visible}
.sparkline .chart-grid{stroke:var(--border);stroke-width:1;stroke-dasharray:3 6}.sparkline .axis-label{fill:var(--muted);font-family:Inter,sans-serif;font-size:10px}.sparkline .y-label{text-anchor:end}.sparkline .x-label{text-anchor:middle}
.sparkline .area{fill:color-mix(in srgb,var(--energy-color) 16%,transparent)}.sparkline .line-shadow{fill:none;stroke:color-mix(in srgb,var(--energy-color) 22%,transparent);stroke-width:10;stroke-linecap:round;stroke-linejoin:round}.sparkline .line{fill:none;stroke:var(--energy-color);stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 3px 4px color-mix(in srgb,var(--energy-color) 30%,transparent))}
.sparkline .data-point{fill:var(--surface);stroke:var(--energy-color);stroke-width:2.5;cursor:crosshair;transition:r .15s}.sparkline .data-point:hover,.sparkline .data-point:focus{r:7;outline:none}.sparkline .hover-line{stroke:var(--energy-color);stroke-width:1;stroke-dasharray:4 4;opacity:0;pointer-events:none}.sparkline .hover-dot{fill:var(--surface);stroke:var(--energy-color);stroke-width:3;opacity:0;pointer-events:none}.sparkline .visible{opacity:1}
.chart-tooltip{position:absolute;z-index:4;min-width:132px;padding:.62rem .75rem;border:1px solid color-mix(in srgb,var(--energy-color) 45%,var(--border));border-radius:10px;background:color-mix(in srgb,var(--surface) 94%,transparent);box-shadow:0 12px 32px rgba(2,6,23,.2);opacity:0;pointer-events:none;transform:translateX(-50%) translateY(5px);transition:opacity .12s,transform .12s;backdrop-filter:blur(10px)}.chart-tooltip.visible{opacity:1;transform:translateX(-50%) translateY(0)}.chart-tooltip span{display:block;color:var(--muted);font-size:.61rem}.chart-tooltip strong{display:block;margin-top:.2rem;color:var(--text);font-size:.76rem;white-space:nowrap}
.chart-scroll-hint{position:absolute;right:.75rem;bottom:.55rem;padding:.25rem .45rem;border-radius:6px;background:color-mix(in srgb,var(--surface) 88%,transparent);color:var(--muted);font-size:.54rem;pointer-events:none}
@media(max-width:700px){.history-card-rich{padding-top:.85rem}.history-card-head{padding:0 .85rem}.sparkline{height:230px}.chart-scroll-hint{display:none}}
@media(prefers-reduced-motion:reduce){.chart-tooltip,.sparkline .data-point{transition:none}}