@media screen {
  #app .app-main .finance-detail-metrics { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; margin: 10px 0 14px !important; }
  #app .app-main .finance-detail-metrics::before, #app .app-main .finance-detail-metrics::after { display: none; }
  #app .app-main .finance-detail-metrics > .finance-detail-metric { float: none; width: auto !important; min-width: 0; padding: 0 !important; }
  #app .app-main .finance-detail-metric > .stat-card { box-sizing: border-box; height: 100%; min-height: 0; padding: 12px 14px; text-align: left; border: 1px solid #e1e8f0; border-radius: 7px; background: #f8fafc; }
  #app .app-main .finance-detail-metric .stat-label { margin: 0 0 7px; font-size: 12px; line-height: 1.5; color: #64748b; }
  #app .app-main .finance-detail-metric .stat-value { margin: 0; font-size: 22px; line-height: 1.35; overflow-wrap: anywhere; }
  #app .app-main .finance-detail-metric .el-tag { max-width: 100%; height: auto; min-height: 26px; white-space: normal; line-height: 1.5; padding-block: 3px; overflow-wrap: anywhere; }
  @media (max-width: 1050px) {
    #app .app-main .finance-detail-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  }
  @media (max-width: 640px) {
    #app .app-main .finance-detail-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
    #app .app-main .finance-detail-metric > .stat-card { padding: 10px; }
    #app .app-main .finance-detail-metric .stat-value { font-size: 20px; }
  }
}