.kpi-workspace { --kpi-line: var(--c-border-soft); --kpi-tint: color-mix(in srgb, var(--c-accent-soft) 34%, var(--c-surface)); width: 100%; min-width: 0; color: var(--c-text); font-size: 13px; line-height: 1.45; }
.kpi-workspace *, .kpi-workspace *::before, .kpi-workspace *::after { box-sizing: border-box; }
.kpi-workspace [hidden] { display: none !important; }
.kpi-workspace h1, .kpi-workspace h2, .kpi-workspace h3, .kpi-workspace p { margin: 0; }
.kpi-workspace h2 { font-size: 16px; line-height: 1.4; }
.kpi-workspace h3 { font-size: 13px; }
.kpi-workspace dl { margin: 0; font-variant-numeric: tabular-nums; }
.kpi-workspace dd { margin: 0; overflow-wrap: anywhere; }
.kpi-workspace button, .kpi-workspace input, .kpi-workspace select { font: inherit; }
.kpi-workspace button, .kpi-workspace summary { cursor: pointer; }
.kpi-workspace button:disabled { cursor: default; opacity: .5; }
.kpi-workspace :is(button, input, select, summary):focus-visible { outline: 2px solid var(--c-accent); outline-offset: 3px; }
.kpi-workspace .kpi-icon { flex: none; width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.kpi-workspace .kpi-button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 40px; padding: 8px 12px; border: 1px solid var(--c-border); border-radius: 8px; background: var(--c-surface); color: var(--c-text); }
.kpi-workspace .kpi-button:hover { background: var(--c-surface-2); }
.kpi-workspace .kpi-icon-button { flex: 0 0 40px; width: 40px; padding: 0; }
.kpi-workspace .kpi-icon-button[aria-expanded=true] { background: var(--kpi-tint); border-color: var(--c-accent); }
.kpi-workspace .kpi-visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.kpi-workspace .kpi-toolbar { display: flex; gap: 10px; align-items: center; min-width: 0; margin-bottom: 10px; }
.kpi-workspace .kpi-page-heading { flex: 1; min-width: 0; }
.kpi-workspace .kpi-toolbar h1 { font-size: 26px; letter-spacing: -.6px; font-weight: 700; line-height: 1.2; overflow-wrap: anywhere; }
.kpi-workspace .kpi-month-field { flex: 0 1 180px; min-width: 0; }
.kpi-workspace .kpi-month-field input, .kpi-workspace .kpi-search-field input, .kpi-workspace .kpi-field select { width: 100%; min-width: 0; min-height: 40px; padding: 9px 11px; border: 1px solid var(--c-border); border-radius: 8px; background: var(--c-surface); color: var(--c-text); }
.kpi-workspace .kpi-month-field .ui-control-trigger { min-height: 40px; border-radius: 8px; box-shadow: none; }
.kpi-workspace .kpi-search-field { position: relative; flex: 0 1 245px; min-width: 130px; }
.kpi-workspace .kpi-search-field > .kpi-icon { position: absolute; top: 11px; left: 11px; color: var(--c-text-3); }
.kpi-workspace .kpi-search-field input { padding-left: 37px; }
.kpi-workspace .kpi-filters { display: grid; grid-template-columns: repeat(2, minmax(0, 220px)); gap: 12px; padding: 12px; border: 1px solid var(--kpi-line); border-radius: 9px; background: var(--c-surface); margin-bottom: 12px; }
.kpi-workspace .kpi-field { display: grid; gap: 5px; min-width: 0; }
.kpi-workspace .kpi-field > span { color: var(--c-text-2); font-size: 12px; }
.kpi-workspace .kpi-context-note { margin-bottom: 14px; font-size: 12px; color: var(--c-text-3); }
.kpi-workspace .kpi-empty { padding: 22px 16px; border: 1px solid var(--kpi-line); border-radius: 10px; background: var(--c-surface); color: var(--c-text-2); }
.kpi-workspace .kpi-error { margin: 12px 0; color: var(--c-danger-text); }
.kpi-workspace .kpi-roster-table-wrap, .kpi-workspace .kpi-metrics-table-wrap { overflow-x: auto; border: 1px solid var(--kpi-line); border-radius: 10px; background: var(--c-surface); }
.kpi-workspace table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 13px; font-variant-numeric: tabular-nums; }
.kpi-workspace th { padding: 11px 14px; background: var(--c-surface-2); color: var(--c-text-2); font-weight: 400; font-size: 12px; }
.kpi-workspace td { padding: 10px 14px; border-top: 1px solid var(--kpi-line); }
.kpi-workspace th, .kpi-workspace td { text-align: left; vertical-align: middle; overflow-wrap: anywhere; }
.kpi-workspace .kpi-roster-table th:first-child { width: 29%; }
.kpi-workspace .kpi-roster-table th:nth-child(2) { width: 13%; }
.kpi-workspace .kpi-roster-table th:nth-child(3) { width: 18%; }
.kpi-workspace .kpi-roster-table th:last-child { width: 48px; }
.kpi-workspace .kpi-roster-table tr[data-selected=true] td { background: var(--kpi-tint); }
.kpi-workspace .kpi-person-link { justify-content: flex-start; padding: 0; min-height: 24px; border: 0; border-radius: 3px; background: none; font-weight: 650; text-align: left; }
.kpi-workspace .kpi-person-link:hover { background: none; text-decoration: underline; text-underline-offset: 3px; }
.kpi-workspace .kpi-person-meta { display: block; margin-top: 3px; color: var(--c-text-3); font-size: 12px; overflow-wrap: anywhere; }
.kpi-workspace .kpi-roster-money { font-weight: 650; }
.kpi-workspace .kpi-roster-number { font-weight: 550; }
.kpi-workspace .kpi-checklist-roster-note { display: block; margin-top: 3px; font-size: 11px; font-weight: 400; color: var(--c-text-3); }
.kpi-workspace .kpi-row-toggle { min-height: 32px; width: 32px; padding: 0; border: 0; background: none; }
.kpi-workspace .kpi-row-toggle[aria-expanded=true] .kpi-icon { transform: rotate(180deg); }
.kpi-workspace .kpi-status { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 5px; color: var(--c-text-3); font-size: 12px; }
.kpi-workspace .kpi-status[data-status=ready] { padding: 4px 7px; color: var(--c-success-text); background: color-mix(in srgb, var(--c-success-text) 8%, var(--c-surface)); border: 1px solid color-mix(in srgb, var(--c-success-text) 15%, var(--c-surface)); border-radius: 5px; }
.kpi-workspace .kpi-status[data-status=blocked] { color: var(--c-warn-text); }
.kpi-workspace .kpi-status-reason { flex-basis: 100%; max-width: 220px; font-size: 11px; line-height: 1.4; }
.kpi-workspace .kpi-roster-cards, .kpi-workspace .kpi-metric-cards { display: none; }
.kpi-workspace .kpi-back-button { display: inline-flex; min-height: 32px; margin: 0 0 10px; padding: 0; background: none; border: none; color: var(--c-text-2); }
.kpi-workspace .kpi-employee-detail { margin-top: 16px; min-width: 0; }
.kpi-workspace[data-kpi-scope=self] .kpi-employee-detail { margin-top: 0; }
.kpi-workspace .kpi-detail-heading { margin-bottom: 14px; }
.kpi-workspace .kpi-detail-person { flex: 1; min-width: 0; }
.kpi-workspace .kpi-detail-person h2 { font-size: 20px; letter-spacing: -.3px; overflow-wrap: anywhere; }
.kpi-workspace .kpi-bonus-summary { display: grid; grid-template-columns: 1.2fr 1.6fr; gap: 20px; align-items: center; min-width: 0; padding: 16px; border: 1px solid var(--kpi-line); border-radius: 10px; background: var(--c-surface); }
.kpi-workspace .kpi-bonus-total { min-width: 0; }
.kpi-workspace .kpi-bonus-total > span { display: block; font-size: 12px; }
.kpi-workspace .kpi-bonus-total > strong { display: block; font-size: 28px; font-weight: 700; font-variant-numeric: tabular-nums; line-height: 1.4; overflow-wrap: anywhere; }
.kpi-workspace .kpi-bonus-total > small { display: block; font-size: 11px; color: var(--c-text-3); }
.kpi-workspace .kpi-bonus-parts { display: grid; flex: 1; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; min-width: 0; }
.kpi-workspace .kpi-bonus-parts > div { border-left: 1px solid var(--kpi-line); padding-left: 20px; }
.kpi-workspace .kpi-bonus-parts dt { font-size: 12px; color: var(--c-text-2); }
.kpi-workspace .kpi-bonus-parts dd { font-size: 18px; font-weight: 650; margin-top: 3px; }
.kpi-workspace .kpi-section-heading { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 10px; }
.kpi-workspace .kpi-metrics-section { padding: 16px; border: 1px solid var(--kpi-line); border-radius: 10px; background: var(--c-surface); }
.kpi-workspace .kpi-base { font-size: 12px; color: var(--c-text-3); margin: -4px 0 12px; }
.kpi-workspace .kpi-base strong { color: var(--c-text); margin-left: 4px; font-variant-numeric: tabular-nums; }
.kpi-workspace .kpi-metrics-table th:first-child { width: 24%; }
.kpi-workspace .kpi-metrics-table th:nth-child(2) { width: 27%; }
.kpi-workspace .kpi-metrics-table th:nth-child(3) { width: 13%; }
.kpi-workspace .kpi-metrics-table th:last-child { width: 17%; }
.kpi-workspace .kpi-metrics-table :is(th, td):last-child { text-align: right; }
.kpi-workspace .kpi-plan-fact > *, .kpi-workspace .kpi-allocation, .kpi-workspace .kpi-metric-contribution > * { display: block; }
.kpi-workspace .kpi-plan-fact { font-size: 12px; line-height: 1.7; }
.kpi-workspace .kpi-plan-fact strong, .kpi-workspace .kpi-allocation { font-size: 13px; }
.kpi-workspace .kpi-allocation { margin-top: 3px; }
.kpi-workspace .kpi-row-formula { font-size: 12px; }
.kpi-workspace .kpi-metric-contribution strong { font-size: 16px; }
.kpi-workspace .kpi-metric-contribution small { margin-top: 3px; font-size: 11px; }
.kpi-workspace .kpi-metric-date { display: block; color: var(--c-text-3); font-size: 11px; margin-top: 3px; }
.kpi-workspace .kpi-metric-reason { display: block; color: var(--c-warn-text); font-size: 11px; margin-top: 5px; }
.kpi-workspace .kpi-metric-contribution { font-weight: 550; }
.kpi-workspace .kpi-performance-good { color: var(--c-success-text); }
.kpi-workspace .kpi-performance-low { color: var(--c-warn-text); }
.kpi-workspace .kpi-metrics-total { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; margin-top: 8px; background: var(--c-surface-2); border-radius: 8px; font-weight: 650; font-variant-numeric: tabular-nums; }
.kpi-workspace .kpi-note { color: var(--c-text-3); font-size: 12px; margin-top: 8px; }
.kpi-workspace .kpi-weighted-formula { margin-top: 8px; color: var(--c-text-2); font-size: 12px; font-variant-numeric: tabular-nums; }
.kpi-workspace .kpi-calculation-note { padding: 10px 12px; margin-bottom: 16px; border: 1px solid var(--kpi-line); border-radius: 8px; color: var(--c-text-2); background: var(--c-surface-2); }
.kpi-workspace .kpi-blockers { display: grid; gap: 5px; padding: 12px 12px 12px 30px; border-radius: 8px; margin: 0 0 18px; color: var(--c-warn-text); background: color-mix(in srgb, var(--c-accent-soft) 22%, var(--c-surface)); }
.kpi-workspace .kpi-bottom-grid { display: grid; grid-template-columns: 1.1fr 1fr; align-items: start; gap: 12px; margin-top: 16px; }
.kpi-workspace .kpi-checklist-section, .kpi-workspace .kpi-coefficients { padding: 14px; border: 1px solid var(--kpi-line); border-radius: 10px; min-width: 0; background: var(--c-surface); }
.kpi-workspace .kpi-checklist-values { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 15px; }
.kpi-workspace .kpi-checklist-values > div + div { border-left: 1px solid var(--kpi-line); padding-left: 12px; }
.kpi-workspace .kpi-checklist-values dt { font-size: 12px; color: var(--c-text-3); }
.kpi-workspace .kpi-checklist-values dd { font-size: 17px; font-weight: 650; margin-top: 3px; }
.kpi-workspace .kpi-checklist-amount { font-size: 21px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.kpi-workspace .kpi-checklist-result { display: flex; align-items: flex-start; gap: 7px; margin-top: 14px; font-size: 12px; }
.kpi-workspace .kpi-checklist-formula { margin-top: 8px; font-size: 12px; font-variant-numeric: tabular-nums; }
.kpi-workspace .kpi-checklist-link { margin-top: 12px; }
.kpi-workspace .kpi-checklist-scale { margin-top: 12px; padding-top: 9px; border-top: 1px solid var(--kpi-line); }
.kpi-workspace .kpi-checklist-scale > summary { min-height: 30px; color: var(--c-text-2); }
.kpi-workspace .kpi-checklist-scale[open] > summary .kpi-icon { transform: rotate(180deg); }
.kpi-workspace .kpi-checklist-scale dl { margin-top: 6px; }
.kpi-workspace .kpi-checklist-scale dl > div { display: flex; justify-content: space-between; gap: 12px; padding: 8px; border-top: 1px solid var(--kpi-line); }
.kpi-workspace .kpi-checklist-scale dl > div[data-selected=true] { background: var(--kpi-tint); font-weight: 600; }
.kpi-workspace .kpi-checklist-total { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding-top: 12px; margin-top: 12px; border-top: 1px solid var(--kpi-line); }
.kpi-workspace .kpi-checklist-total strong { font-size: 18px; font-variant-numeric: tabular-nums; }
.kpi-workspace summary { display: flex; justify-content: space-between; align-items: center; gap: 10px; list-style: none; }
.kpi-workspace summary::-webkit-details-marker { display: none; }
.kpi-workspace .kpi-inspections { margin-top: 12px; border-top: 1px solid var(--kpi-line); padding-top: 9px; }
.kpi-workspace .kpi-inspections > summary { min-height: 30px; justify-content: flex-start; color: var(--c-text-2); }
.kpi-workspace .kpi-inspections[open] > summary .kpi-icon { transform: rotate(180deg); }
.kpi-workspace .kpi-inspection-items { list-style: none; padding: 0; margin: 8px 0 0; }
.kpi-workspace .kpi-inspection-items li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 7px 12px; padding: 10px 0; border-top: 1px solid var(--kpi-line); font-size: 12px; }
.kpi-workspace .kpi-inspection-item-name { display: flex; align-items: flex-start; gap: 8px; }
.kpi-workspace .kpi-inspection-item-name .kpi-icon-check { color: var(--c-success-text); }
.kpi-workspace .kpi-inspection-item-name .kpi-icon-warning { color: var(--c-warn-text); }
.kpi-workspace .kpi-inspection-items .kpi-metric-reason { grid-column: 1 / -1; margin: 0 0 0 26px; }
.kpi-workspace .kpi-inspection-list { list-style: none; padding: 0; margin: 8px 0 0; }
.kpi-workspace .kpi-inspection-list li { display: grid; grid-template-columns: 1fr 1.4fr auto; gap: 8px; padding-block: 8px; border-top: 1px solid var(--kpi-line); font-size: 12px; }
.kpi-workspace .kpi-coefficients > summary { min-height: 24px; font-size: 16px; font-weight: 700; }
.kpi-workspace .kpi-coefficients[open] > summary .kpi-icon { transform: rotate(180deg); }
.kpi-workspace .kpi-coefficient-group { padding-top: 10px; }
.kpi-workspace .kpi-coefficient-group h3 { font-size: 12px; color: var(--c-text-3); font-weight: 400; padding-bottom: 3px; }
.kpi-workspace .kpi-coefficient-group dl > div { display: flex; justify-content: space-between; gap: 10px; padding: 9px 0; border-top: 1px solid var(--kpi-line); }
.kpi-workspace .kpi-coefficient-group dd { text-align: right; }
.kpi-workspace .kpi-coefficient-effect { padding-top: 9px; font-size: 12px; font-variant-numeric: tabular-nums; }
.kpi-workspace .kpi-salary-section { margin-top: 14px; padding: 16px; border: 1px solid var(--kpi-line); border-radius: 10px; background: var(--c-surface); }
.kpi-workspace .kpi-salary-components { display: flex; flex-wrap: wrap; gap: 14px 32px; margin-top: 14px; }
.kpi-workspace .kpi-salary-components dt, .kpi-workspace .kpi-salary-balance dt { font-size: 12px; color: var(--c-text-3); }
.kpi-workspace .kpi-salary-components dd { margin-top: 3px; font-size: 18px; font-weight: 650; }
.kpi-workspace .kpi-salary-balance { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 14px; border: 1px solid var(--kpi-line); border-radius: 8px; overflow: hidden; }
.kpi-workspace .kpi-salary-balance > div { padding: 9px 12px; }
.kpi-workspace .kpi-salary-balance > div + div { border-left: 1px solid var(--kpi-line); }
.kpi-workspace .kpi-salary-balance dd { margin-top: 3px; font-size: 17px; font-weight: 650; }
.kpi-workspace .kpi-salary-remainder { background: var(--kpi-tint); }
.kpi-workspace .kpi-saved-salary { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--kpi-line); }
.kpi-workspace .kpi-saved-salary > summary { justify-content: flex-start; font-size: 12px; color: var(--c-text-2); }
.kpi-workspace .kpi-saved-salary[open] > summary .kpi-icon { transform: rotate(180deg); }
.kpi-workspace .kpi-saved-values { display: flex; flex-wrap: wrap; gap: 10px 24px; margin-top: 10px; font-size: 12px; }
.kpi-workspace .kpi-saved-values dt { color: var(--c-text-3); }
.kpi-workspace .kpi-salary-blockers { padding-left: 18px; margin: 10px 0; color: var(--c-warn-text); font-size: 12px; }
.kpi-workspace .kpi-payroll-link { justify-content: space-between; flex-direction: row-reverse; min-width: 210px; margin-top: 14px; }
@media (max-width: 1100px) {
  .kpi-workspace .kpi-bonus-summary { width: 100%; }
  .kpi-workspace .kpi-roster-table th:first-child { width: 25%; }
  .kpi-workspace .kpi-roster-table th:nth-child(3) { width: 20%; }
}
@media (max-width: 800px) {
  .kpi-workspace .kpi-toolbar { display: grid; grid-template-columns: minmax(0, 1fr) 170px 40px; gap: 9px; }
  .kpi-workspace .kpi-toolbar h1 { font-size: 24px; margin-right: 0; }
  .kpi-workspace[data-kpi-selected=true] .kpi-page-heading { grid-column: 1 / -1; }
  .kpi-workspace[data-kpi-selected=true] .kpi-month-field { grid-row: 2; grid-column: 1 / 3; }
  .kpi-workspace[data-kpi-selected=true] .kpi-toolbar > .kpi-icon-button:last-child { grid-row: 2; }
  .kpi-workspace .kpi-month-field { grid-column: 2; grid-row: 1; }
  .kpi-workspace .kpi-toolbar > .kpi-icon-button:last-child { grid-column: 3; grid-row: 1; }
  .kpi-workspace .kpi-search-field { grid-column: 1 / 3; grid-row: 2; min-width: 0; }
  .kpi-workspace .kpi-toolbar > .kpi-icon-button:not(:last-child) { grid-column: 3; grid-row: 2; }
  .kpi-workspace .kpi-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kpi-workspace .kpi-roster-table-wrap, .kpi-workspace .kpi-metrics-table-wrap { display: none; }
  .kpi-workspace .kpi-roster-cards, .kpi-workspace .kpi-metric-cards { display: grid; gap: 12px; }
  .kpi-workspace[data-kpi-selected=true] .kpi-roster, .kpi-workspace[data-kpi-selected=true] .kpi-search-field, .kpi-workspace[data-kpi-selected=true] .kpi-toolbar > .kpi-icon-button:not(:last-child), .kpi-workspace[data-kpi-selected=true] .kpi-filters { display: none; }
  .kpi-workspace .kpi-person-card { padding: 14px; border: 1px solid var(--kpi-line); border-radius: 11px; background: var(--c-surface); }
  .kpi-workspace .kpi-person-card-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
  .kpi-workspace .kpi-person-card-heading .kpi-person-link { font-size: 16px; }
  .kpi-workspace .kpi-roster-card-values { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 12px; gap: 10px; }
  .kpi-workspace .kpi-roster-card-values dt { font-size: 12px; color: var(--c-text-3); }
  .kpi-workspace .kpi-roster-card-values dd { margin-top: 3px; font-size: 16px; font-weight: 650; }
  .kpi-workspace .kpi-card-total { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; border-top: 1px solid var(--kpi-line); padding-top: 10px; }
  .kpi-workspace .kpi-card-total dt { font-size: 13px; color: var(--c-text); }
  .kpi-workspace .kpi-employee-detail { padding: 0; border: 0; background: none; margin-top: 8px; }
  .kpi-workspace .kpi-back-button { min-height: 36px; margin-bottom: 10px; }
  .kpi-workspace .kpi-detail-heading { display: block; margin-bottom: 24px; }
  .kpi-workspace .kpi-detail-person { margin-bottom: 17px; }
  .kpi-workspace .kpi-detail-person h2 { font-size: 20px; }
  .kpi-workspace .kpi-bonus-summary { display: block; border: 1px solid var(--kpi-line); border-top: 5px solid var(--c-accent-soft); border-radius: 11px; padding: 15px; background: var(--c-surface); }
  .kpi-workspace .kpi-bonus-total { padding: 0 0 14px; background: none; border-radius: 0; }
  .kpi-workspace .kpi-bonus-total > span { font-size: 15px; font-weight: 600; }
  .kpi-workspace .kpi-bonus-total > strong { font-size: 30px; margin-top: 4px; }
  .kpi-workspace .kpi-bonus-total > small { font-size: 12px; margin-top: 5px; }
  .kpi-workspace .kpi-bonus-parts { padding-top: 13px; border-top: 1px solid var(--kpi-line); gap: 14px; }
  .kpi-workspace .kpi-bonus-parts > div { border-left: 0; padding-left: 0; }
  .kpi-workspace .kpi-bonus-parts > div + div { border-left: 1px solid var(--kpi-line); padding-left: 14px; }
  .kpi-workspace .kpi-bonus-parts dd { font-size: 21px; }
  .kpi-workspace .kpi-section-heading { align-items: baseline; gap: 10px; margin-bottom: 12px; }
  .kpi-workspace h2 { font-size: 18px; }
  .kpi-workspace .kpi-metrics-section { padding: 0; border: 0; background: none; }
  .kpi-workspace .kpi-base { max-width: none; text-align: left; margin-bottom: 12px; }
  .kpi-workspace .kpi-base strong { display: inline-block; }
  .kpi-workspace .kpi-metric-card { min-width: 0; border: 1px solid var(--kpi-line); border-radius: 10px; background: var(--c-surface); overflow: hidden; }
  .kpi-workspace .kpi-metric-heading { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 13px; }
  .kpi-workspace .kpi-metric-heading h3 { font-size: 15px; min-width: 0; overflow-wrap: anywhere; }
  .kpi-workspace .kpi-weight { padding: 4px 8px; border: 1px solid var(--c-border); border-radius: 7px; white-space: nowrap; font-size: 12px; }
  .kpi-workspace .kpi-metric-values { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kpi-workspace .kpi-metric-values > div { min-width: 0; padding: 10px 13px; border-top: 1px solid var(--kpi-line); }
  .kpi-workspace .kpi-metric-values > div:nth-child(even) { border-left: 1px solid var(--kpi-line); }
  .kpi-workspace .kpi-metric-values dt { color: var(--c-text-3); font-size: 12px; }
  .kpi-workspace .kpi-metric-values dd { font-size: 17px; font-weight: 650; margin-top: 3px; }
  .kpi-workspace .kpi-metric-card > .kpi-metric-date { margin: 0; padding: 8px 13px; border-top: 1px solid var(--kpi-line); }
  .kpi-workspace .kpi-metric-card > .kpi-metric-date + .kpi-metric-date { padding-top: 0; border-top: 0; }
  .kpi-workspace .kpi-metric-formula { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 12px; padding: 11px 13px; border-top: 1px solid var(--kpi-line); font-size: 12px; font-variant-numeric: tabular-nums; }
  .kpi-workspace .kpi-metric-card > .kpi-metric-reason { margin: 0; padding: 0 13px 10px; }
  .kpi-workspace .kpi-metrics-total { padding: 12px; margin-top: 10px; background: var(--c-surface); font-size: 14px; }
  .kpi-workspace .kpi-bottom-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; margin-top: 22px; }
  .kpi-workspace .kpi-checklist-section, .kpi-workspace .kpi-coefficients { background: var(--c-surface); padding: 14px; }
  .kpi-workspace .kpi-checklist-values { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kpi-workspace .kpi-checklist-values > div:nth-child(3) { grid-column: 1 / -1; padding: 11px 0 0; border-left: 0; border-top: 1px solid var(--kpi-line); }
  .kpi-workspace .kpi-checklist-values dd { font-size: 20px; }
  .kpi-workspace .kpi-checklist-link { width: 100%; min-height: 44px; }
  .kpi-workspace .kpi-coefficients > summary { font-size: 18px; }
  .kpi-workspace .kpi-payroll-link { width: 100%; min-height: 46px; margin-top: 18px; text-align: left; }
  .kpi-workspace .kpi-salary-components, .kpi-workspace .kpi-salary-balance, .kpi-workspace .kpi-saved-values { display: block; border: 0; }
  .kpi-workspace .kpi-salary-components > div, .kpi-workspace .kpi-salary-balance > div, .kpi-workspace .kpi-saved-values > div { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 7px 0; border: 0; }
  .kpi-workspace .kpi-salary-components dd, .kpi-workspace .kpi-salary-balance dd { font-size: 15px; margin-top: 0; text-align: right; }
  .kpi-workspace .kpi-salary-gross { border-top: 1px solid var(--kpi-line) !important; margin-top: 4px; }
  .kpi-workspace .kpi-salary-gross dt { font-weight: 650; color: var(--c-text); }
  .kpi-workspace .kpi-salary-balance { margin-top: 0; }
  .kpi-workspace .kpi-salary-balance .kpi-salary-remainder { padding: 12px; border-radius: 8px; margin-top: 8px; }
  .kpi-workspace .kpi-salary-remainder dt { color: var(--c-text); font-weight: 650; }
}
@media (max-width: 390px) {
  .kpi-workspace .kpi-toolbar { grid-template-columns: minmax(0, 1fr) 175px 36px; gap: 7px; }
  .kpi-workspace .kpi-toolbar h1 { font-size: 22px; }
  .kpi-workspace .kpi-toolbar .kpi-icon-button { width: 36px; }
  .kpi-workspace .kpi-month-field input { padding-inline: 6px; font-size: 12px; }
  .kpi-workspace .kpi-metric-values > div { padding-inline: 11px; }
  .kpi-workspace .kpi-metric-values dd { font-size: 16px; }
}