/* Shared workspace width; each wide table owns its scrolling area. */
main:has(#connection-success:not([hidden])) { width: min(100%, 1240px); }
[hidden] { display: none !important; }
#cis-search, #osu, .success, .km-panel, #km-products { min-width: 0; max-width: 100%; }
#connection-success .balance-modes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.balance-modes button { width: 100%; text-align: left; padding: 20px; border-radius: 14px; }
.balance-modes button strong, .balance-modes button span { display: block; }
.balance-modes button span { margin-top: 8px; font-size: 13px; font-weight: 400; line-height: 1.5; }
.balance-modes button[aria-pressed="true"] { background: #edf3ff; color: #174be0; border: 1px solid #2563eb; box-shadow: inset 4px 0 #2563eb; }
.balance-modes button[aria-pressed="false"] { background: #fff; color: #334155; border: 1px solid #d8e2ef; }
.km-panel { border: 1px solid #d8e2ef; border-radius: 16px; padding: 22px; margin: 20px 0; }
.km-panel h4, .km-panel h3 { margin-top: 0; }
.km-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin: 16px 0; }
.km-actions p { flex: 1 1 240px; }
.km-group { border: 1px solid #d8e2ef; border-radius: 12px; padding: 16px; margin: 12px 0; }
.km-group-selected { border-color: #2563eb; background: #f0f5ff; }
.km-group label { display: flex; align-items: center; gap: 12px; cursor: pointer; }
.km-group input[type="checkbox"] { width: 20px; height: 20px; margin: 0; accent-color: #2457e8; flex-shrink: 0; }
.km-group-info { display: flex; flex-wrap: wrap; gap: 10px 24px; margin: 12px 0; font-size: 13px; color: #526071; }
.km-phase { display: inline-block; border-radius: 7px; padding: 5px 9px; margin: 2px 0; font-size: 13px; background: #edf2f8; }
.km-phase-ready { color: #147653; background: #e6f7ef; }
.km-phase-error { color: #a5273a; background: #fff0f2; }
.km-warning, .km-phase-partial { color: #805709; background: #fff6d7; padding: 10px; border-radius: 8px; }
.km-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 20px 0; }
.km-metric { padding: 16px; border-radius: 12px; background: #f1f5fb; font-size: 15px; line-height: 1.6; }
.km-metric-expired { background: #fff0f2; color: #a5273a; }
.km-metric-expiring_soon, .km-metric-introduced_gt_12_months { background: #fff6d7; color: #805709; }
.km-metric-introduced_gt_24_months, .km-danger { background: #fff0f2; color: #a5273a; }
.km-age-warning { background: #fff6d7; color: #805709; }
.km-tabs button.km-danger[aria-pressed="true"] { color: #a5273a; background: #fff0f2; border-color: #a5273a; }
.km-tabs button.km-age-warning[aria-pressed="true"] { color: #805709; background: #fff6d7; border-color: #805709; }
.km-table-scroll { max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; }
.km-table-scroll table { width: 100%; min-width: 950px; border-collapse: collapse; }
.km-table-scroll th, .km-table-scroll td { text-align: left; padding: 12px; border-bottom: 1px solid #e2e8f0; vertical-align: top; font-size: 13px; white-space: normal; }
.km-table-scroll th { background: #f5f7fb; color: #526071; font-weight: 600; }
.km-table-scroll td:first-child { min-width: 180px; white-space: pre-line; overflow-wrap: anywhere; }
#km-summary td:nth-child(7) { min-width: 110px; }
#km-summary td:nth-child(8) { min-width: 120px; }
#km-summary td:last-child button { max-width: 150px; }
.km-table-scroll summary { cursor: pointer; min-width: 150px; }
.km-table-scroll details p { margin: 8px 0; }
.km-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin: 16px 0; }
.km-tabs button { font-size: 13px; padding: 10px 12px; }
.km-tabs button[aria-pressed="true"] { color: #174be0; background: #edf3ff; border-color: #2563eb; }
.km-single-code { border-top: 1px solid #d8e2ef; padding-top: 18px; margin-top: 24px; }
.km-single-code > summary { cursor: pointer; }
#km-products > button { margin: 12px 12px 12px 0; }
#km-restore-dialog { box-sizing: border-box; width: min(480px, calc(100% - 32px)); max-height: calc(100% - 32px); overflow: auto; padding: 24px; border: 1px solid #d8e2ef; border-radius: 16px; color: #1e293b; background: #fff; box-shadow: 0 20px 60px #0f172a33; }
#km-restore-dialog::backdrop { background: #0f172a80; }
#km-restore-dialog h3 { margin-top: 0; }
.km-restore-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.km-restore-actions button { max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
@media (max-width: 900px) { .km-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 580px) {
    #connection-success .balance-modes, .km-metrics { grid-template-columns: minmax(0, 1fr); }
    #connection-success { padding: 16px; }
    .km-panel { padding: 12px; }
    .km-actions { align-items: stretch; flex-direction: column; }
    .km-actions p { flex-basis: auto; }
    .km-group-info { flex-direction: column; }
    .km-group { padding: 12px; }
    .km-tabs button { max-width: 100%; overflow-wrap: anywhere; }
}

.km-composition-dialog { width: min(680px, 90vw); max-height: 80vh; overflow: auto; border: 1px solid #b8c8dc; border-radius: 12px; padding: 24px; }
.km-composition-dialog::backdrop { background: #17233499; }
.km-composition-dialog table { width: 100%; border-collapse: collapse; overflow-wrap: anywhere; }
.km-composition-dialog td { padding: 8px; border-bottom: 1px solid #e2e8f0; }
/* KM write-off only: override the connection summary's nested definition-list grid. */
:is(#km-writeoff,.inventory-linked-documents), :is(#km-writeoff-calculation,.inventory-writeoff-layout), .km-writeoff-actions { min-width: 0; overflow-wrap: normal; word-break: normal; }
.km-writeoff-action-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: 1fr; gap: 10px; max-width: 1000px; margin: 16px 0; }
.km-writeoff-action-grid button { margin: 0; width: 100%; min-width: 0; white-space: normal; overflow-wrap: normal; }
.km-writeoff-info { margin: 16px 0; padding: 14px 16px; border: 1px solid #d8e2ef; border-radius: 10px; background: #f1f5fb; color: #526071; font-size: 13px; line-height: 1.6; }
:is(#km-writeoff-calculation,.inventory-writeoff-layout) { margin-top: 20px; border-top: 1px solid #d8e2ef; padding-top: 20px; }
:is(#km-writeoff-calculation,.inventory-writeoff-layout) label { display: flex; flex-direction: column; gap: 8px; margin: 0; min-width: 0; }
#km-writeoff-cutoff-section { max-width: 300px; }
:is(#km-writeoff-calculation,.inventory-writeoff-layout) input, :is(#km-writeoff-calculation,.inventory-writeoff-layout) select { width: 100%; min-width: 0; box-sizing: border-box; }
:is(#km-writeoff-calculation,.inventory-writeoff-layout) .km-writeoff-form-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 20px; }
:is(#km-writeoff-calculation,.inventory-writeoff-layout) .km-writeoff-wide, :is(#km-writeoff,.inventory-linked-documents) .km-writeoff-wide { grid-column: 1 / -1; }
:is(#km-writeoff-calculation,.inventory-writeoff-layout) .km-writeoff-reason-fields { display: contents; }
:is(#km-writeoff-calculation,.inventory-writeoff-layout) .km-writeoff-reason-help { font-size: 13px; color: #64748b; font-weight: 400; }
:is(#km-writeoff-calculation,.inventory-writeoff-layout) .km-writeoff-form-actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 16px 0 0; }
:is(#km-writeoff-calculation,.inventory-writeoff-layout) .km-writeoff-form-actions button { margin: 0; max-width: 100%; white-space: normal; }
#km-writeoff-mod-section { margin-top: 16px; }
#km-writeoff-mod-error { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-top: 12px; }
#km-writeoff-mod-error button { margin: 0; }
:is(#km-writeoff-calculation,.inventory-writeoff-layout) .km-writeoff-summary { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin: 20px 0; padding: 16px; border-radius: 10px; background: #f1f5fb; }
:is(#km-writeoff-calculation,.inventory-writeoff-layout) .km-writeoff-summary > div, :is(#km-writeoff,.inventory-linked-documents) .km-document-fields > div { display: block; min-width: 0; }
:is(#km-writeoff-calculation,.inventory-writeoff-layout) .km-writeoff-summary dt, :is(#km-writeoff,.inventory-linked-documents) .km-document-fields dt { color: #64748b; font-size: 13px; }
:is(#km-writeoff-calculation,.inventory-writeoff-layout) .km-writeoff-summary dd { margin: 6px 0 0; font-weight: 600; white-space: nowrap; overflow-wrap: normal; }
:is(#km-writeoff-calculation,.inventory-writeoff-layout) .km-writeoff-exclusions { margin: 8px 0 16px; padding-left: 22px; }
:is(#km-writeoff,.inventory-linked-documents) .osu-active-card, :is(#km-writeoff,.inventory-linked-documents) .osu-archive-card { overflow-wrap: normal; }
:is(#km-writeoff,.inventory-linked-documents) .km-document-heading { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin-bottom: 16px; }
:is(#km-writeoff,.inventory-linked-documents) .km-document-heading h4, :is(#km-writeoff,.inventory-linked-documents) .km-document-heading p { margin: 0; }
:is(#km-writeoff,.inventory-linked-documents) .km-document-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 24px; margin: 16px 0; }
:is(#km-writeoff,.inventory-linked-documents) .km-document-fields dd { margin: 4px 0 0; overflow-wrap: normal; }
:is(#km-writeoff,.inventory-linked-documents) .km-writeoff-nowrap { white-space: nowrap; }
:is(#km-writeoff,.inventory-linked-documents) .km-document-check { margin: 16px 0; padding: 12px 16px; border-radius: 10px; color: #147653; background: #e6f7ef; }
:is(#km-writeoff,.inventory-linked-documents) .km-document-check p { margin: 4px 0; }
:is(#km-writeoff,.inventory-linked-documents) .km-document-upstream { overflow-wrap: anywhere; }
:is(#km-writeoff,.inventory-linked-documents) .km-document-composition { margin: 16px 0; }
:is(#km-writeoff,.inventory-linked-documents) .km-document-composition > summary { cursor: pointer; }
:is(#km-writeoff,.inventory-linked-documents) .km-document-actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 16px 0 0; }
:is(#km-writeoff,.inventory-linked-documents) .km-document-actions button { margin: 0; max-width: 100%; white-space: normal; }
:is(#km-writeoff,.inventory-linked-documents) .km-document-actions .km-document-primary { margin-inline-start: auto; }
:is(:is(#km-writeoff,.inventory-linked-documents), :is(#km-writeoff-calculation,.inventory-writeoff-layout), .km-writeoff-actions) :is(button, input, select, summary):focus-visible { outline: 2px solid #2563eb; outline-offset: 3px; }
@media (max-width: 760px) {
    .km-writeoff-action-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    :is(#km-writeoff-calculation,.inventory-writeoff-layout) .km-writeoff-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 580px) {
    .km-writeoff-action-grid, :is(#km-writeoff-calculation,.inventory-writeoff-layout) .km-writeoff-form-fields, :is(#km-writeoff,.inventory-linked-documents) .km-document-fields { grid-template-columns: minmax(0, 1fr); }
    #km-writeoff-cutoff-section { max-width: none; }
    :is(#km-writeoff-calculation,.inventory-writeoff-layout) .km-writeoff-form-actions button, :is(#km-writeoff,.inventory-linked-documents) .km-document-actions button { width: 100%; }
    :is(#km-writeoff,.inventory-linked-documents) .km-document-actions .km-document-primary { margin-inline-start: 0; }
    :is(#km-writeoff,.inventory-linked-documents) .osu-withdrawal, .osu-withdrawal.km-writeoff-actions { padding: 12px; }
}
.km-cancellation-confirm { max-width: min(32rem, calc(100vw - 3rem)); border: 1px solid #cbd5e1; border-radius: .75rem; padding: 1.25rem; }
.km-cancellation-confirm::backdrop { background: #0f172a66; }
.km-cancellation-document { border-top: 1px solid #cbd5e1; margin-top: 1rem; padding-top: .75rem; overflow-wrap: anywhere; }

.km-mod-filter { display: block; margin: 12px 0; overflow-wrap: anywhere; }
.km-mod-filter select { display: block; width: 100%; padding: 10px; margin-top: 6px; }
.km-mod-filter select[hidden] { display: none; }
.km-mod-picker { position: relative; width: 100%; min-width: 0; margin-top: 6px; }
.km-mod-picker .km-mod-picker-trigger {
    display: flex; align-items: center; gap: 12px; width: 100%; min-width: 0; min-height: 44px;
    box-sizing: border-box; margin: 0; padding: 10px 14px; border: 1px solid #cddae2; border-radius: 8px;
    background: #fff; color: var(--ux-ink, #173447); font: inherit; text-align: left; cursor: pointer;
}
.km-mod-picker .km-mod-picker-trigger:hover { background: #f5fbfd; border-color: #80c4e5; }
.km-mod-picker-trigger::after { content: ''; width: 7px; height: 7px; border: solid currentColor; border-width: 0 1.5px 1.5px 0; transform: rotate(45deg); flex: none; margin: -4px 2px 0 auto; }
.km-mod-picker-trigger[aria-disabled=true] { color: #677884; background: #f7fafb; cursor: default; }
.km-mod-picker-value { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.km-mod-picker-list {
    position: absolute; z-index: 20; inset: calc(100% + 4px) 0 auto; width: 100%; box-sizing: border-box;
    max-height: min(280px, 40vh); overflow-y: auto; padding: 4px; border: 1px solid #cddae2;
    border-radius: 8px; background: #fff; box-shadow: 0 8px 24px #1734471a;
}
.km-mod-picker-option { padding: 10px; border-radius: 5px; cursor: pointer; }
.km-mod-picker-option[aria-selected=true] { background: #e9f6fc; color: #17658a; }
.km-mod-picker-option:hover, .km-mod-picker-option.is-active { background: #e9f6fc; outline: 1px solid #80c4e5; outline-offset: -1px; }
.km-mod-picker-option[aria-disabled=true] { color: #677884; cursor: default; }
.km-mod-picker-tip {
    position: fixed; z-index: 100; box-sizing: border-box; width: max-content; max-width: min(560px, calc(100vw - 24px));
    max-height: calc(100vh - 24px); overflow-y: auto; padding: 10px 12px; border: 1px solid #cddae2;
    border-radius: 8px; background: #fff; color: #173447; box-shadow: 0 6px 20px #17344726;
    font-size: 13px; line-height: 1.5; font-weight: 400; white-space: normal; overflow-wrap: anywhere;
}
.km-mod-picker [hidden] { display: none; }