.performance-monitoring-workspace { max-width: none !important; padding: 24px 30px 42px !important; }
.performance-monitoring-workspace .management-page-header { max-width: none; margin-bottom: 18px; }
.performance-monitoring-workspace .management-page-header .lede { max-width: 720px; }
.performance-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 0 0 20px; }
.performance-summary article { min-height: 112px; padding: 18px 20px; border: 1px solid #d5e5df; border-radius: 12px; background: linear-gradient(145deg, #fffefa, #f4fbf8); }
.performance-summary span { display: block; color: #69807a; font-size: .68rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.performance-summary strong { display: block; margin-top: 8px; color: #176b61; font: 2rem/1 Georgia, serif; }
.performance-summary small { display: block; margin-top: 7px; overflow: hidden; color: #657a75; font-size: .8rem; text-overflow: ellipsis; white-space: nowrap; }
.performance-list-panel { max-width: none !important; padding: 0 !important; overflow: hidden; }
.performance-list-filter-bar { display: grid; grid-template-columns: minmax(190px, 270px) minmax(190px, 270px) auto auto; align-items: end; gap: 12px; margin: 0; padding: 20px 22px; border-bottom: 1px solid #dce7e3; background: #f8fbfa; }
.performance-list-filter-bar > div { display: grid; gap: 6px; min-width: 0; }
.performance-list-filter-bar label { color: #70817d; font-size: .7rem; font-weight: 850; letter-spacing: .07em; text-transform: uppercase; }
.performance-list-filter-bar select { box-sizing: border-box; width: 100%; min-height: 40px; padding: 8px 28px 8px 10px; border: 1px solid #cbdcd6; border-radius: 8px; background: #fff; color: #263a36; font: inherit; font-size: .86rem; }
.performance-list-filter-bar .button { min-height: 32px; padding: 0 11px; border: 0; border-radius: 7px; cursor: pointer; font-size: .76rem; white-space: nowrap; }
.performance-list-clear { align-self: center; margin-top: 22px; color: #55716b; font-size: .85rem; font-weight: 800; }
.performance-list-summary { display: flex; align-items: baseline; justify-content: space-between; gap: 18px; margin: 0; padding: 16px 22px 13px; color: #647773; }
.performance-list-summary p { margin: 0; }.performance-list-summary strong { color: #176b61; font-size: 1.14rem; }.performance-list-summary span { color: #81908c; font-size: .82rem; }
.performance-list-table-wrap { overflow-x: auto; border-top: 1px solid #d8e4e0; }.performance-list-table { min-width: 1120px; background: #fffefa; }
.performance-list-table-head, .performance-list-row { display: grid; grid-template-columns: minmax(250px, 1.55fr) 130px 135px minmax(180px, 1.1fr) 125px 175px; gap: 16px; align-items: center; }.performance-list-table-head { padding: 13px 22px 11px; background: #f0f7f4; color: #71837e; font-size: .69rem; font-weight: 850; letter-spacing: .07em; text-transform: uppercase; }.performance-list-row { min-height: 78px; padding: 14px 22px; border-top: 1px solid #e0e9e6; }.performance-list-row:hover { background: #f7fbf9; }.performance-list-row > div { min-width: 0; }
.performance-action strong, .performance-baseline strong { display: block; overflow: hidden; color: #324a45; font-size: .88rem; text-overflow: ellipsis; white-space: nowrap; }.performance-action small, .performance-baseline small { display: block; overflow: hidden; margin-top: 4px; color: #81908c; font-size: .73rem; text-overflow: ellipsis; white-space: nowrap; }
.performance-metric { text-align: center; }.performance-metric strong { display: block; color: #176b61; font-size: .98rem; }.performance-metric small { display: block; margin-top: 2px; color: #81908c; font-size: .68rem; font-weight: 700; }.performance-list-date time { display: block; color: #516a65; font-size: .78rem; font-weight: 700; line-height: 1.35; }
.performance-delta { display: inline-flex; align-items: center; justify-content: center; min-width: 62px; padding: 4px 7px; border-radius: 999px; font-size: .73rem; font-weight: 850; font-variant-numeric: tabular-nums; white-space: nowrap; }.performance-delta.is-faster { background: #e1f4ea; color: #176d49; }.performance-delta.is-slower { background: #fff0df; color: #9a5918; }.performance-delta.is-neutral { background: #eef2f1; color: #62736f; }.performance-result { display: inline-flex; min-width: 84px; justify-content: center; padding: 5px 8px; border-radius: 999px; font-size: .72rem; font-weight: 850; text-transform: capitalize; }.performance-result.is-success { background: #dff5e8; color: #176d49; }.performance-result.is-redirect { background: #e7f1f8; color: #326784; }.performance-result.is-client-error { background: #fff2d8; color: #936215; }.performance-result.is-server-error { background: #fbe5e3; color: #a33b34; }
@media (max-width: 900px) { .performance-monitoring-workspace { padding: 20px !important; }.performance-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .performance-list-filter-bar { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }.performance-list-filter-bar .button { justify-self: start; }.performance-list-clear { align-self: end; margin-top: 0; } }
@media (max-width: 620px) { .performance-monitoring-workspace { padding: 16px !important; }.performance-summary { grid-template-columns: 1fr; }.performance-summary article { min-height: 0; }.performance-list-filter-bar { grid-template-columns: 1fr; padding: 18px; }.performance-list-filter-bar .button { width: auto; }.performance-list-clear { align-self: start; margin-top: 0; }.performance-list-summary { align-items: start; flex-direction: column; gap: 4px; padding: 14px 18px 11px; } }