/* Scoped to the contract workspace; other system layouts retain their styles. */
#contracts { min-width: 0; letter-spacing: 0; --contract-muted: #66717d; --contract-line: #e8ebef; }
#contracts [hidden] { display: none !important; }
#contracts > .section-header { margin-bottom: 14px; }
#contracts h1 { font-size: 24px; line-height: 1.4; letter-spacing: 0; }
#contracts h2 { font-size: 16px; line-height: 1.5; letter-spacing: 0; }
#contracts .contract-title-line { gap: 12px; align-items: center; }
#contracts .contract-updated-at { color: var(--contract-muted); background: #f8f9fb; border-color: var(--contract-line); font-size: 12px; font-weight: 500; }
#contracts .muted { color: var(--contract-muted); }
#contracts .panel { border-radius: 0; box-shadow: none; border: 0; }
#contracts .kpi-grid.compact {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 0;
  margin-bottom: 14px;
  background: #fff;
  border-block: 1px solid var(--contract-line);
}
#contracts .kpi-card { border: 0; border-radius: 0; box-shadow: none; padding: 12px 16px; min-width: 0; border-right: 1px solid var(--contract-line); }
#contracts .kpi-card:last-child { border-right: 0; }
#contracts .kpi-value { font-size: 24px; line-height: 1.4; font-weight: 650; color: #27313d; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; margin: 4px 0; letter-spacing: 0; }
#contracts .contract-money-unit { font-size: 14px; font-weight: 500; white-space: nowrap; margin-inline-start: 3px; }
#contracts .kpi-card:nth-child(2) .kpi-value { color: #087f75; }
#contracts .kpi-card:nth-child(4) .kpi-value { color: #c80016; }
#contracts .kpi-card:nth-child(5) .kpi-value { color: #9a610e; }
#contracts .kpi-card:nth-child(6) .kpi-value { color: #386cac; }
#contracts .kpi-label, #contracts .kpi-foot { font-size: 12px; color: var(--contract-muted); }
#contracts .kpi-foot { line-height: 1.6; margin: 0; }
#contracts .contracts-toolbar { grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(180px, 1.3fr) auto; padding: 14px 16px 10px; gap: 10px 12px; margin-bottom: 0; border-bottom: 1px solid var(--contract-line); }
#contracts .contracts-toolbar label, #contracts .contract-category-filter, #contracts .contract-period-filter { color: var(--contract-muted); gap: 6px; }
#contracts .contracts-toolbar select, #contracts .contracts-toolbar input:not([type="checkbox"]), #contracts .contract-multi-select-button { height: 36px; min-height: 36px; font-size: 12px; padding: 6px 10px; border-radius: 6px; border-color: #dfe4ea; }
#contracts .contracts-toolbar :is(select, input:not([type="checkbox"]), .contract-multi-select-button):hover { border-color: #aebbc8; }
#contracts :is(.secondary-button, .primary-button) { border-radius: 6px; box-shadow: none; }
#contracts .contract-period-fields { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto; gap: 6px; }
#contracts .contract-period-fields .secondary-button { height: 36px; min-height: 36px; padding: 6px 10px; }
#contracts .contracts-search { grid-column: auto; }
#contracts .contract-advanced-filters { grid-column: 1 / -1; }
#contracts .contract-advanced-filters > summary { cursor: pointer; color: var(--contract-muted); font-size: 12px; width: fit-content; padding-block: 2px; }
#contracts .contract-advanced-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; align-items: end; padding: 10px 0 4px; }
#contracts .contracts-toolbar-actions { justify-content: flex-end; gap: 8px; }
#contracts .contracts-toolbar-actions button { height: 36px; min-height: 36px; padding: 6px 10px; white-space: nowrap; }
#contracts .contract-ai-disclosure { background: #fff; border-bottom: 1px solid var(--border); margin-bottom: 14px; }
#contracts .contract-ai-disclosure > summary { cursor: pointer; padding: 8px 16px; font-size: 12px; font-weight: 600; color: #386cac; }
#contracts .contract-ai-panel { margin: 0; padding: 8px 12px 14px; }
#contracts .contract-ai-result:empty { display: none; }
#contracts .contract-view-tabs { display: flex; gap: 24px; border-bottom: 1px solid var(--contract-line); background: #fff; padding-inline: 16px; }
#contracts .contract-view-tabs button { border: 0; border-bottom: 2px solid transparent; border-radius: 0; padding: 10px 0; background: none; color: var(--contract-muted); font-size: 13px; cursor: pointer; }
#contracts .contract-view-tabs button[aria-selected="true"] { color: #c80016; border-bottom-color: #c80016; font-weight: 700; }
#contracts .contracts-workbench { display: block; margin: 0; }
#contracts .contracts-workbench .panel { margin: 0; }
#contracts .contract-ledger-panel { padding: 12px 16px; margin: 0; }
#contracts .panel-header { gap: 12px; flex-wrap: wrap; }
#contracts .contract-ledger-panel > .panel-header { margin-bottom: 0; gap: 8px 16px; }
#contracts #contractLedgerBadge { display: block; font-size: 12px; line-height: 1.6; margin-top: 2px; }
#contracts .contract-ledger-actions { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
#contracts .contract-ledger-actions button { min-height: 30px; font-size: 12px; padding: 5px 8px; }
#contracts .contract-ledger-actions .badge { font-size: 11px; font-weight: 500; background: #f5f7f9; color: var(--contract-muted); border: 1px solid var(--contract-line); border-radius: 4px; }
#contracts #contractSourceBadge { max-width: 260px; overflow-wrap: anywhere; white-space: normal; }
#contracts .contract-ledger-navigation { display: flex; justify-content: space-between; gap: 8px 16px; align-items: center; flex-wrap: wrap; margin: 8px 0; }
#contracts .contract-quick-filters { display: flex; flex-wrap: wrap; gap: 6px 12px; }
#contracts .contract-quick-filters button { cursor: pointer; border: 0; border-radius: 0; background: none; padding: 4px 0; border-bottom: 2px solid transparent; color: #647080; font: inherit; font-size: 12px; }
#contracts .contract-quick-filters button[aria-pressed="true"] { color: #b90012; border-bottom-color: #b90012; }
#contracts .contract-pagination, #contracts .contract-pagination label { display: flex; gap: 8px; align-items: center; font-size: 12px; color: #647080; }
#contracts .contract-pagination button, #contracts .contract-pagination select, #contracts .contract-pagination input { height: 30px; border: 1px solid var(--border); border-radius: 4px; background: #fff; color: #273446; padding: 3px 6px; font: inherit; }
#contracts .contract-pagination button { width: 30px; cursor: pointer; }
#contracts .contract-pagination button:disabled { opacity: .4; cursor: default; }
#contracts .contract-pagination input { width: 54px; }
#contracts .contracts-ledger-wrap { max-height: 64vh; min-height: 160px; scrollbar-gutter: auto; overscroll-behavior-x: contain; padding-bottom: 4px; }
#contracts .contracts-ledger-table { width: 1830px; min-width: 1830px; border-collapse: separate; border-spacing: 0; font-size: 12px; }
#contracts .contracts-ledger-table th, #contracts .contracts-ledger-table td { padding: 8px 10px; box-sizing: border-box; border-bottom-color: var(--contract-line); line-height: 1.5; }
#contracts .contracts-ledger-table th { position: sticky; top: 0; z-index: 3; height: 36px; background: #f4f6f8; color: #5f6a77; font-weight: 600; box-shadow: 0 1px 0 #e0e5eb; }
#contracts .contracts-ledger-table td { background: #fff; color: #303a46; }
#contracts .contracts-ledger-table td b { font-weight: 600; }
#contracts .contracts-ledger-table tr:nth-child(even) td { background: #f9fafb; }
#contracts .contracts-ledger-table tr:hover td, #contracts .contracts-ledger-table tr:focus-within td { background: #f0f4f8; }
#contracts .contracts-ledger-table th:nth-child(1), #contracts .contracts-ledger-table td:nth-child(1) { width: 150px; position: sticky; left: 0; z-index: 2; }
#contracts .contracts-ledger-table th:nth-child(2), #contracts .contracts-ledger-table td:nth-child(2) { width: 280px; position: sticky; left: 150px; z-index: 2; box-shadow: 2px 0 0 #e4e8ed; }
#contracts .contracts-ledger-table th:nth-child(1), #contracts .contracts-ledger-table th:nth-child(2) { z-index: 4; }
#contracts .contracts-ledger-table th:nth-child(3), #contracts .contracts-ledger-table td:nth-child(3) { width: 90px; }
#contracts .contracts-ledger-table th:nth-child(4), #contracts .contracts-ledger-table td:nth-child(4) { width: 160px; overflow-wrap: anywhere; }
#contracts .contracts-ledger-table th:nth-child(5), #contracts .contracts-ledger-table td:nth-child(5) { width: 320px; }
#contracts .contracts-ledger-table th:nth-child(n+6):nth-child(-n+9), #contracts .contracts-ledger-table td:nth-child(n+6):nth-child(-n+9) { width: 115px; font-variant-numeric: tabular-nums; }
#contracts .contracts-ledger-table th:nth-child(10), #contracts .contracts-ledger-table td:nth-child(10) { width: 300px; }
#contracts .contracts-ledger-table th:nth-child(11), #contracts .contracts-ledger-table td:nth-child(11) { width: 70px; }
#contracts .contract-detail-button { padding: 0; border: 0; background: none; text-align: left; cursor: pointer; color: #245b91; font: inherit; width: 100%; }
#contracts .contract-detail-button:hover { text-decoration: underline; }
#contracts .contract-name-cell { min-width: 0; }
#contracts .contract-name-cell b, #contracts .contract-name-cell span { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; max-width: 100%; white-space: normal; overflow-wrap: anywhere; line-height: 1.5; overflow: hidden; }
#contracts .contract-name-cell span { color: var(--contract-muted); margin-top: 3px; font-size: 11px; }
#contracts .contract-mode { border-radius: 4px; font-weight: 500; padding: 2px 6px; min-width: 0; }
#contracts .contract-category-label { margin-top: 3px; color: var(--contract-muted); white-space: normal; }
#contracts .contract-month-cell { min-width: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 10px; }
#contracts .contract-month-cell > div:not(.contract-lag-tags) { display: flex; align-items: baseline; flex-wrap: wrap; gap: 2px 6px; }
#contracts .contract-month-cell span { color: var(--contract-muted); white-space: nowrap; }
#contracts .contract-month-cell b { font-size: 12px; line-height: 1.5; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
#contracts .contract-month-cell strong { border-radius: 4px; padding: 1px 6px; font-size: 11px; font-weight: 500; line-height: 1.6; }
#contracts .contract-month-cell .contract-lag-tags span { white-space: normal; }
#contracts .contract-progress.neutral em { background: #647c94; }
#contracts .contract-tag-group { display: flex; flex-wrap: wrap; gap: 3px 4px; margin: 2px 0; }
#contracts .contract-risk-tags span { display: inline-block; margin: 0; font-size: 11px; border-radius: 3px; line-height: 1.5; padding: 1px 5px; white-space: normal; overflow-wrap: anywhere; }
#contracts .contract-risk-tags .contract-tag-risk, #contracts .contract-risk-tags .contract-status-risk { background: #fff0f0; color: #b51f33; }
#contracts .contract-risk-tags .contract-tag-process { background: transparent; color: #506985; }
#contracts .contract-risk-tags .contract-tag-info { background: transparent; color: var(--contract-muted); }
#contracts .contract-risk-tags .contract-status-pending { background: #f1f3f5; color: #626e7b; }
#contracts .contract-tag-secondary { gap: 2px 0; }
#contracts .contract-tag-secondary span { padding: 0; }
#contracts .contract-tag-secondary span + span::before { content: "/"; color: #a3acb6; padding: 0 5px; }
#contracts .contract-risk-tags .contract-status-settled { background: #eaf7f2; color: #14765b; }
#contracts .contract-horizontal-scroll { position: fixed; display: flex; align-items: center; gap: 4px; z-index: 25; height: 26px; background: #f1f3f6; border-top: 1px solid #dce2e8; box-shadow: 0 -2px 6px rgb(40 50 60 / 4%); }
#contracts .contract-horizontal-scroll button { width: 24px; flex: 0 0 24px; height: 24px; padding: 0; border: 0; border-radius: 0; background: none; color: #657483; font-size: 10px; cursor: pointer; }
#contracts .contract-horizontal-scroll button:disabled { opacity: .3; cursor: default; }
#contracts .contract-horizontal-scroll input { appearance: none; -webkit-appearance: none; flex: 1; min-width: 0; margin: 0; height: 12px; padding: 0; border: 0; border-radius: 0; background: #dde3e9; cursor: ew-resize; }
#contracts .contract-horizontal-scroll input::-webkit-slider-thumb { appearance: none; -webkit-appearance: none; width: var(--contract-scroll-thumb, 60px); height: 12px; border: 0; border-radius: 4px; background: #7e8c9b; }
#contracts .contract-horizontal-scroll input::-moz-range-thumb { width: var(--contract-scroll-thumb, 60px); height: 12px; border: 0; border-radius: 4px; background: #7e8c9b; }
#contracts .contract-risk-section { margin: 0 0 22px; }
#contracts .contract-risk-section h3 { margin: 0 0 10px; font-size: 14px; }
#contracts .contract-risk-grid { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); }
#contracts .contract-risk-chip { text-align: left; cursor: pointer; border-radius: 4px; font: inherit; background: #fff; }
#contracts .contract-risk-chip:hover { border-color: #9aabbf; }
#contracts .contract-kind-risk b { color: #b51f33; }
#contracts .contract-kind-process b { color: #386cac; }
#contracts .contract-kind-info b { color: #626e7b; }
#contracts .contract-amount-dialog { width: min(560px, calc(100% - 32px)); max-height: 85vh; overflow: auto; border: 1px solid var(--border); border-radius: 8px; padding: 22px; color: var(--text); }
#contracts .contract-amount-dialog::backdrop { background: rgb(15 23 42 / 35%); }
#contracts .contract-amount-dialog .panel-header { margin-bottom: 12px; }
#contracts .contract-amount-dialog .panel-header button { width: 32px; height: 32px; padding: 0; font-size: 22px; }
#contracts .contract-amount-name { overflow-wrap: anywhere; font-size: 14px; line-height: 1.6; }
#contracts .contract-amount-dialog dl > div { display: flex; justify-content: space-between; gap: 16px; padding: 9px 0; font-size: 13px; }
#contracts .contract-amount-dialog dd { margin: 0; text-align: right; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
#contracts .contract-amount-total { border-top: 1px solid var(--border); font-weight: 700; }
#contracts :is(button, summary, input, select, .contracts-ledger-wrap, .contract-horizontal-scroll):focus-visible { outline: 2px solid #386cac; outline-offset: 2px; }
@media (max-width: 1800px) and (min-width: 1501px) {
  #contracts .kpi-card { padding-inline: 12px; }
}
@media (max-width: 1500px) {
  #contracts .kpi-card { padding: 10px 12px; }
  #contracts .contracts-toolbar { grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(170px, 1.3fr) auto; }
  #contracts .contracts-search { grid-column: auto; }
}
@media (max-width: 1100px) {
  #contracts .kpi-grid.compact { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  #contracts .kpi-card:nth-child(-n+3) { border-bottom: 1px solid var(--contract-line); }
  #contracts .kpi-card:nth-child(3n) { border-right: 0; }
  #contracts .contract-advanced-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  #contracts .contracts-ledger-table th:nth-child(2), #contracts .contracts-ledger-table td:nth-child(2) { position: static; box-shadow: none; }
  #contracts .contracts-ledger-table th:nth-child(2) { position: sticky; left: auto; z-index: 3; }
  #contracts .contracts-toolbar { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  #contracts .contracts-search { grid-column: span 2; }
}
@media (max-width: 700px) {
  #contracts h1 { font-size: 20px; }
  #contracts .contract-title-line { gap: 6px; }
  #contracts .kpi-grid.compact { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #contracts .kpi-card { border-right: 1px solid var(--contract-line); border-bottom: 1px solid var(--contract-line); }
  #contracts .kpi-card:nth-child(3n) { border-right: 1px solid var(--contract-line); }
  #contracts .kpi-card:nth-child(2n) { border-right: 0; }
  #contracts .contracts-toolbar { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 12px; }
  #contracts .contract-advanced-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #contracts .contract-period-filter, #contracts .contracts-search { grid-column: 1 / -1; }
  #contracts .contract-period-fields { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto; gap: 4px; }
  #contracts .contract-period-fields input { width: 100%; }
  #contracts .contract-period-fields .secondary-button { padding: 5px; }
  #contracts .contract-period-fields input { padding-inline: 4px; }
  #contracts .contracts-toolbar-actions { grid-column: 1 / -1; }
  #contracts .contract-view-tabs { gap: 18px; }
  #contracts .contract-view-tabs button { font-size: 13px; }
  #contracts .contracts-ledger-table th:nth-child(1), #contracts .contracts-ledger-table td:nth-child(1) { width: 120px; }
  #contracts .contract-ledger-panel { padding: 10px 0; }
  #contracts .contract-pagination { flex-wrap: wrap; }
  #contracts .contract-amount-dialog { padding: 16px; }
}