.trend-heading{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.trend-heading .monitor-badge{margin-left:auto}
.trend-toolbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin:1.2rem 0 .9rem;flex-wrap:wrap}
.trend-toolbar h6{font-size:.92rem;margin:0 0 .35rem}
.trend-unit{font-size:.72rem;color:var(--text2)}
.trend-switch{display:flex;gap:4px;padding:4px;border:1px solid var(--gb);border-radius:10px;background:rgba(100,110,150,.06)}
.trend-switch button{border:0;border-radius:7px;background:transparent;color:var(--text2);padding:.45rem .95rem;font-size:.8rem;white-space:nowrap}
.trend-switch button[aria-pressed="true"]{background:rgba(125,142,248,.18);color:var(--text);box-shadow:inset 0 0 0 1px rgba(139,157,255,.24)}
.trend-switch button:focus-visible,.trend-series:focus-visible,.trend-chart canvas:focus-visible{outline:2px solid #8b9dff;outline-offset:3px}
.trend-legend{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.65rem}
.trend-series{display:grid;text-align:left;gap:.28rem;border:1px solid var(--gb);border-radius:10px;background:rgba(126,141,200,.04);padding:.8rem 1rem;color:var(--text);min-width:0;font-variant-numeric:tabular-nums;transition:opacity .15s}
.trend-series[aria-pressed="false"]{opacity:.42}
.trend-series-name{display:flex;gap:.5rem;align-items:center;font-size:.77rem;color:var(--text2)}
.trend-swatch{display:inline-block;width:18px;border-top:3px solid var(--series-color)}
.trend-swatch.dashed{border-top-style:dashed}
.trend-series strong{font-size:1.45rem;font-weight:650;color:var(--series-color);line-height:1.3}
.trend-peak{font-size:.72rem;color:var(--text2)}
.trend-chart{position:relative;height:240px;margin-top:1rem}
.trend-chart canvas{display:block;width:100%;height:100%;border-radius:4px;touch-action:pan-y}
.trend-tooltip{position:absolute;top:10px;z-index:1;width:208px;padding:.6rem .8rem;border:1px solid var(--gb);border-radius:8px;background:var(--bg);box-shadow:0 6px 24px rgba(0,0,0,.2);pointer-events:none;font-size:.75rem;line-height:1.8;font-variant-numeric:tabular-nums}
.trend-tooltip strong{font-size:.68rem;color:var(--text2);font-weight:500}
.trend-readout{font-size:.75rem;line-height:1.7;min-height:1.7em;color:var(--text2);font-variant-numeric:tabular-nums;margin:.4rem 0 0}
.trend-notes{display:flex;justify-content:space-between;gap:.35rem 1rem;flex-wrap:wrap;border-top:1px solid var(--gb);padding-top:.75rem;margin-top:.75rem;color:var(--text2);font-size:.7rem;line-height:1.7}
.gpu-observation{font-size:.72rem;line-height:1.7;color:var(--text2);font-variant-numeric:tabular-nums;margin:-.35rem 0 .85rem}
[data-theme="light"] .trend-series strong,[data-theme="light"] .trend-tooltip div{color:var(--text)!important}
@media(max-width:575px){.trend-toolbar{gap:.7rem}.trend-switch button{padding:.4rem .75rem}.trend-legend{grid-template-columns:repeat(auto-fit,minmax(85px,1fr));gap:.4rem}.trend-series{padding:.6rem .5rem}.trend-series strong{font-size:1.2rem}.trend-peak{font-size:.65rem}.trend-swatch{width:12px}.trend-chart{height:225px}.trend-heading .monitor-badge{margin-left:0}.trend-notes{display:block}.trend-notes span{display:block}}