.history-trends{margin-bottom:20px;overflow:hidden}
.trend-header{display:flex;align-items:center;gap:12px 18px;flex-wrap:wrap;padding:14px 20px 12px}
.history-trends .widget-heading{padding:0;flex:1;min-width:270px;align-items:center;flex-wrap:nowrap}
.history-trends .widget-heading h2{font-size:18px;margin:0 0 2px}
.history-trends .widget-heading p{font-size:10px}
.trend-period-badge{display:flex;align-items:center;gap:6px;padding:6px 8px;background:#eff6f6;color:#567b84;border-radius:8px;font-size:10px;white-space:nowrap}
.trend-period-badge .icon{width:14px;height:14px}
.trend-toolbar .view-tabs{margin:0;display:inline-flex;flex-wrap:wrap}
.trend-toolbar .view-tabs button{padding:7px 11px;min-height:36px;font-size:11px}
.trend-filters{display:flex;gap:12px;padding:0 20px 12px;border-bottom:1px solid var(--line)}
.trend-filters label{display:flex;flex-direction:column;gap:3px;font-size:10px;color:#7c929f;flex:1;min-width:0}
.trend-filters select{width:100%;padding:7px 10px;color:#405e70;background:#fff;border:1px solid var(--line);border-radius:8px;font:inherit;font-size:12px;min-height:36px}
.trend-content{padding:12px 20px 10px}
.trend-content h3{margin:0 0 2px;font-size:15px}
.trend-title-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.trend-title-row h3{min-width:0}
.trend-team-link{font-size:11px;white-space:nowrap;flex-shrink:0}
.trend-description{margin:0 0 8px;font-size:10px;color:#8096a4}
.trend-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:8px}
.trend-summary>div{background:#f5f9fa;border:1px solid #edf2f3;border-radius:8px;padding:7px 12px;display:flex;flex-direction:column;gap:0}
.trend-summary span{color:#7c929f;font-size:10px}
.trend-summary strong{font-size:20px;line-height:1.35;color:#31586b}
.trend-summary strong.positive{color:#168575}
.trend-summary strong small{font-size:11px;font-weight:500}
.trend-summary>div>small{font-size:9px;color:#91a1ab}
.trend-plot{width:100%;min-width:0}
.trend-plot svg{display:block;width:100%;height:164px;overflow:visible}
.trend-grid{stroke:#e6edf0;stroke-width:1}
.trend-axis{fill:#8096a4;font-size:11px;font-family:inherit}
.trend-line{stroke:#178f84;stroke-width:3;fill:none;stroke-linejoin:round;stroke-linecap:round}
.trend-target{stroke:#b69c66;stroke-width:2;stroke-dasharray:7 5;fill:none}
.trend-point{fill:#fff;stroke:#178f84;stroke-width:2}
.trend-plot a:focus .trend-point,.trend-plot a:hover .trend-point{fill:#178f84;stroke:#175b57;stroke-width:4}
.trend-legend{display:flex;flex-wrap:wrap;align-items:center;gap:16px;font-size:10px;color:#8096a4;margin:2px 0 8px 52px}
.trend-legend span{display:flex;align-items:center;gap:7px}
.trend-legend i{display:block;width:18px;border-top:3px solid #178f84}
.trend-legend i.target{border-top:2px dashed #b69c66}
.trend-legend span:last-child{margin-left:auto}
.trend-data{border-top:1px solid var(--line);padding-top:7px}
.trend-data summary{color:var(--teal);font-size:11px;cursor:pointer;min-height:28px}
.trend-data table{font-size:11px}
.trend-data .table-wrap{max-height:330px;overflow:auto}
.trend-footnote{font-size:9px;color:#8fa2ad;margin:4px 0 8px;line-height:1.7}
.achievement-list{max-height:590px;overflow-y:auto;scrollbar-gutter:stable}
.achievement-scroll-hint{font-size:10px;color:#8096a4;margin:0;padding:7px 20px;border-bottom:1px solid var(--line);background:#fafcfc}
@media(max-width:700px){
  .trend-header{padding:14px 14px 10px;gap:10px}
  .history-trends .widget-heading{gap:10px;min-width:0;flex-basis:100%}
  .history-trends .widget-heading h2{font-size:17px}
  .history-trends .widget-heading p{font-size:9px}
  .trend-period-badge{font-size:9px;padding:5px 7px}
  .trend-toolbar{width:100%}
  .trend-toolbar .view-tabs{display:flex}
  .trend-toolbar .view-tabs button{font-size:10px;padding:7px;flex:1}
  .trend-filters{padding:0 14px 12px;gap:8px;flex-wrap:wrap}
  .trend-filters label{flex:1 1 130px}
  .trend-filters select{font-size:11px;min-height:40px}
  .trend-content{padding:12px 14px 10px}
  .trend-content h3{font-size:14px}
  .trend-title-row{flex-wrap:wrap;gap:3px;margin-bottom:3px}
  .trend-description{font-size:10px}
  .trend-summary{gap:7px}
  .trend-summary>div{padding:7px 8px}
  .trend-summary strong{font-size:18px}
  .trend-summary strong small{font-size:9px}
  .trend-summary span{font-size:9px}
  .trend-summary>div>small{font-size:8px}
  .trend-plot svg{height:160px}
  .trend-legend{margin-left:0;gap:10px;font-size:9px}
  .trend-axis{font-size:10px}
  .achievement-list{max-height:560px}
}