:root {
    color-scheme: light;
    --pure-white: #ffffff;
    --paper-white: #F9F9F7;
    --deep-black: #191919;
    --deep-gray: #2C3343;
    --dark-gray: #44525E;
    --gray: #596672;
    --mid-gray: #8F979E;
    --pale-gray: #D0D4D7;
    --pale-light-gray: #E7E9EB;
    --midnight-900: #0C1B54;
    --midnight-800: #263E67;
    --midnight-700: #325186;
    --midnight-600: #3E64A6;
    --midnight-500: #5279BD;
    --midnight-400: #7292C9;
    --midnight-300: #92ABD5;
    --midnight-200: #B2C3E1;
    --midnight-100: #D1DBED;
    --midnight-50: #EEF1F7;
    --midnight-25: #F7F9FC;
    --midnight-15: #F9FBFD;
    --gold-900: #382C16;
    --gold-800: #5E4A24;
    --gold-700: #856731;
    --gold-600: #AC853E;
    --gold-500: #C59F59;
    --gold-400: #CEB078;
    --gold-300: #D9C197;
    --gold-200: #E3D3B5;
    --gold-100: #EEE4D3;
    --gold-50: #F9F5F0;
    --gold-25: #FCFBF7;
    --gold-15: #FDFCF9;
    --classic-blue: #004C97;
    --clessic-blue-50: #E5EDF5;
    --classic-blue-25: #F5F8FB;
    --deep-rose: #E52334;
    --deep-rose-50: #FCE9EB;
    --deep-rose-25: #FEF6F7;
    --emerald-green: #009874;
    --emerald-green-50: #E5F7ED;
    --emerald-green-25: #F5FCF8;
    --hospital-sky: #5cc1e7;
    --shadow-100: 0 1px 4px rgba(0, 0, 0, 0.05);
    --font-body: "Pretendard Variable", Pretendard, "Apple SD Gothic Neo", "Noto Sans KR", system-ui, sans-serif;
    --font-serif: "MaruBuriOTF", "Nanum Myeongjo", serif;
}


/* Cash planning and forecast-to-actual review */
.cash-management-page {
    gap: 20px;
}

.cash-period-controls {
    flex-wrap: wrap;
}

.cash-period-controls input {
    width: 142px;
}

.cash-message {
    border: 1px solid #b8dfcf;
    border-radius: 10px;
    background: #effaf5;
    color: #176a4d;
    padding: 11px 14px;
    font-size: 13px;
}

.cash-message.error {
    border-color: #f0c0c0;
    background: #fff4f4;
    color: #a52d2d;
}


.cash-tab-panel:focus-visible {
    outline: 2px solid var(--classic-blue);
    outline-offset: 3px;
}

.cash-tab-panel {
    min-width: 0;
}

.cash-panel-title {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: var(--midnight-800);
    font-size: 14px;
    line-height: 20px;
}

.cash-panel-title > span {
    width: 5px;
    height: 5px;
    flex: 0 0 5px;
    border-radius: 50%;
    background: var(--classic-blue);
}

.cash-content-panel-title {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--midnight-900);
    font-size: 16px;
    line-height: 24px;
}

.cash-content-panel-title > span {
    width: 4px;
    height: 4px;
    flex: 0 0 4px;
    border-radius: 50%;
    background: var(--midnight-600);
}

.cash-overview-grid,
.cash-editor-grid,
.cash-variance-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(320px, .65fr);
    gap: 16px;
}

.cash-editor-grid {
    grid-template-columns: minmax(330px, .72fr) minmax(0, 1.28fr);
}

.cash-flow-compare {
    display: grid;
    gap: 14px;
    padding-top: 10px;
}

.cash-flow-compare > div {
    display: grid;
    grid-template-columns: 94px 110px minmax(80px, 1fr);
    align-items: center;
    gap: 12px;
    font-size: 12px;
}

.cash-flow-compare strong {
    text-align: right;
}

.cash-flow-compare i {
    display: block;
    min-width: 3px;
    height: 9px;
    border-radius: 8px;
    background: #8f81ef;
}

.cash-flow-compare i.actual {
    background: #55b994;
}

.cash-flow-compare i.expense {
    background: #ef9d9d;
}

.cash-flow-compare i.expense.actual {
    background: #e36e6e;
}

.cash-attention-list,
.cash-candidate-list,
.cash-unexpected-list {
    display: grid;
    gap: 8px;
}

.cash-attention-list button {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 3px 10px;
    width: 100%;
    border: 1px solid var(--pale-light-gray);
    border-radius: 10px;
    background: #fff;
    padding: 10px;
    text-align: left;
}

.cash-attention-list button:hover,
.cash-table tr.clickable:hover {
    background: #f8f7ff;
}

.cash-attention-list button small {
    grid-column: 2;
    color: var(--gray);
}

.cash-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
}

.cash-table th,
.cash-table td {
    border-bottom: 1px solid var(--pale-light-gray);
    padding: 11px 10px;
    text-align: right;
    white-space: nowrap;
}

.cash-table th:first-child,
.cash-table td:first-child,
.cash-table th:nth-child(2),
.cash-table td:nth-child(2) {
    text-align: left;
}

.cash-table td strong,
.cash-table td small {
    display: block;
}

.cash-table td small {
    margin-top: 3px;
    color: var(--gray);
    font-size: 10px;
}

.cash-table tr.clickable {
    cursor: pointer;
}

.cash-status {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    background: #eef0f4;
    color: #5e6573;
    padding: 4px 8px;
    font-size: 10px;
    font-weight: 800;
    white-space: nowrap;
}

.cash-status.status-done {
    background: #e9f8f1;
    color: #16704f;
}

.cash-status.status-partial {
    background: #fff5dc;
    color: #936611;
}

.cash-status.status-overdue {
    background: #ffeded;
    color: #a93232;
}

.cash-status.status-planned {
    background: #efedff;
    color: #6652c2;
}

.cash-plan-form {
    align-self: start;
}

.cash-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}

.cash-form-grid label {
    display: grid;
    gap: 5px;
}

.cash-form-grid label > span {
    color: var(--gray);
    font-size: 11px;
    font-weight: 700;
}

.cash-form-grid input,
.cash-form-grid select,
.cash-inline-form input,
.cash-inline-form select {
    min-width: 0;
    height: 38px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 8px;
    background: #fff;
    padding: 0 10px;
}

.cash-plan-form > .btn-large {
    width: 100%;
}

.cash-plan-list-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.cash-management-tabs .cash-tab-year-filter {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    flex: 0 0 auto;
    gap: 8px;
    margin-left: auto;
    padding-left: 16px;
}

.cash-management-tabs .cash-tab-year-filter > span {
    white-space: nowrap;
}

.cash-management-tabs .cash-tab-year-filter .input-small {
    flex: 0 0 104px;
    width: 104px;
}

.figma-modal.cash-plan-create-modal {
    width: min(760px, calc(100vw - 48px));
    max-height: calc(100vh - 48px);
    overflow-y: auto;
}

.cash-plan-create-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.cash-plan-create-form .field-wide {
    grid-column: 1 / -1;
}

.cash-learning-grid {
    grid-template-columns: minmax(0, 1fr);
}

.cash-form-note {
    margin: 10px 0 0;
    color: var(--gray);
    font-size: 11px;
    line-height: 1.6;
}

.cash-unexpected-list > div {
    display: grid;
    grid-template-columns: 40px 1fr auto;
    gap: 3px 10px;
    align-items: center;
    border-bottom: 1px solid var(--pale-light-gray);
    padding: 9px 0;
    font-size: 12px;
}

.cash-unexpected-list small {
    grid-column: 2;
    color: var(--gray);
}

.cash-unexpected-list b {
    grid-column: 3;
    grid-row: 1 / 3;
}

.cash-detail-backdrop {
    position: fixed;
    z-index: 1000;
    inset: 0;
    display: flex;
    justify-content: flex-end;
    background: rgb(15 23 42 / 38%);
}

.cash-detail-panel {
    width: min(520px, 94vw);
    height: 100%;
    overflow-y: auto;
    background: #fff;
    box-shadow: -12px 0 30px rgb(15 23 42 / 14%);
    padding: 24px;
}

.cash-detail-panel > header,
.cash-section-title {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.cash-detail-panel h2 {
    margin: 8px 0 0;
}

.cash-detail-panel h3 {
    margin: 0 0 10px;
    font-size: 14px;
}

.cash-detail-panel > section {
    border-top: 1px solid var(--pale-light-gray);
    margin-top: 20px;
    padding-top: 20px;
}

.cash-detail-panel > section > small,
.cash-section-title span {
    color: var(--gray);
    font-size: 11px;
}

.cash-detail-metrics {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin: 20px 0 0;
}

.cash-detail-metrics div {
    border-radius: 9px;
    background: #f7f8fa;
    padding: 11px;
}

.cash-detail-metrics dt {
    color: var(--gray);
    font-size: 10px;
}

.cash-detail-metrics dd {
    margin: 5px 0 0;
    font-size: 12px;
    font-weight: 700;
}

.cash-inline-form {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.cash-inline-form input {
    flex: 1 1 130px;
}

.cash-check {
    display: flex;
    gap: 6px;
    align-items: center;
    font-size: 11px;
}

.cash-check input {
    flex: 0 0 auto;
    width: auto;
    height: auto;
}

.cash-recommendation {
    border: 1px solid #d9d3ff !important;
    border-radius: 10px;
    background: #f7f5ff;
    padding: 15px !important;
}

.cash-recommendation p {
    color: var(--gray);
    font-size: 12px;
}

.cash-recommendation strong {
    display: block;
    margin-bottom: 10px;
}

.cash-candidate-list > div {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 3px 8px;
    align-items: center;
    border: 1px solid var(--pale-light-gray);
    border-radius: 9px;
    padding: 9px;
}

.cash-candidate-list small {
    grid-column: 2;
    color: var(--gray);
    font-size: 10px;
}

.cash-candidate-list button {
    grid-column: 3;
    grid-row: 1 / 3;
}

.match-score {
    grid-row: 1 / 3;
    border-radius: 7px;
    background: #f0edff;
    color: #6854c7;
    padding: 5px;
    font-size: 10px;
    font-weight: 800;
}

.cash-detail-actions {
    display: flex;
    justify-content: space-between;
    margin-top: 12px;
}

.cash-panel-description {
    display: block;
    margin-top: 4px;
    color: var(--gray);
    font-size: 12px;
}

.cash-detail-period-filter {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.cash-detail-period-filter label > span {
    color: var(--gray);
    font-size: 11px;
}

.cash-detail-period-filter {
    justify-content: flex-end;
    border: 1px solid var(--pale-light-gray);
    border-radius: 9px;
    background: var(--paper-white);
    padding: 9px 12px;
}

.cash-detail-period-filter label {
    display: flex;
    align-items: center;
    gap: 7px;
}

.cash-detail-period-filter input {
    height: 34px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 7px;
    background: #fff;
    padding: 0 8px;
}

.cash-chart-legend,
.cash-month-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.cash-timeline-head-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
}

.cash-month-view-toggle {
    min-width: 82px;
    margin-left: auto;
}

.cash-timeline-navigation {
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-end;
    gap: 6px;
}

.cash-chart-legend {
    justify-content: flex-end;
    margin-top: 12px;
}

.cash-chart-legend span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: var(--gray);
    font-size: 11px;
}

.cash-chart-legend span::before {
    width: 8px;
    height: 8px;
    border-radius: 2px;
    background: var(--midnight-400);
    content: "";
}

.cash-chart-legend span.expense::before {
    background: #e36e6e;
}

.cash-chart-legend span.balance::before {
    border-radius: 999px;
    background: var(--gold-500);
}

.cash-timeline-chart {
    display: grid;
    grid-template-columns: repeat(12, minmax(54px, 1fr));
    gap: 8px;
    min-width: 820px;
    height: 300px;
    margin-top: 22px;
    padding: 18px 12px 0;
    border-bottom: 1px solid var(--pale-light-gray);
    background:
        repeating-linear-gradient(to top, transparent 0, transparent 59px, #eef1f4 60px);
}

.cash-timeline-panel {
    overflow: hidden;
}

.cash-timeline-scroll {
    width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
}

.cash-month-column {
    display: grid;
    grid-template-rows: 26px minmax(0, 1fr) 22px 20px;
    gap: 3px;
    min-width: 0;
    height: 100%;
    border: 0;
    border-radius: 8px 8px 0 0;
    background: transparent;
    color: var(--deep-black);
    cursor: pointer;
}

.cash-month-column:hover,
.cash-month-column.selected {
    background: rgb(82 121 189 / 8%);
}

.cash-month-column.current {
    box-shadow: inset 0 0 0 1px var(--midnight-200);
}

.cash-month-balance {
    overflow: hidden;
    color: var(--gold-700);
    font-size: 10px;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cash-bar-stage {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 3px;
    min-height: 0;
}

.cash-bar-stage i {
    width: min(16px, 42%);
    min-height: 2px;
    border-radius: 4px 4px 0 0;
    background: var(--midnight-400);
}

.cash-bar-stage i.expense {
    background: #e36e6e;
}

.cash-month-column strong {
    font-size: 11px;
}

.cash-month-column small {
    color: var(--gray);
    font-size: 9px;
}

.cash-timeline-divider {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    min-width: 820px;
    color: var(--gray);
    font-size: 10px;
    text-align: center;
}

.cash-timeline-divider span {
    padding-top: 8px;
    border-top: 2px solid var(--pale-light-gray);
}

.cash-timeline-divider strong {
    margin: -4px 8px 0;
    border-radius: 999px;
    background: var(--midnight-100);
    color: var(--midnight-700);
    padding: 4px 9px;
}

.cash-month-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin: 14px 0;
}

.cash-month-metrics article {
    display: grid;
    gap: 6px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 9px;
    background: var(--midnight-25);
    padding: 12px;
}

.cash-month-metrics span,
.cash-month-metrics small {
    color: var(--gray);
    font-size: 10px;
}

.cash-month-metrics strong {
    font-size: 16px;
}

.cash-account-month-table {
    min-width: 760px;
}

.cash-matrix-scroll {
    margin-top: 16px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 9px;
}

.cash-flow-horizontal-table {
    width: max-content;
    min-width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 11px;
}

.cash-flow-horizontal-table th,
.cash-flow-horizontal-table td {
    min-width: 86px;
    border-right: 1px solid var(--pale-light-gray);
    border-bottom: 1px solid var(--pale-light-gray);
    padding: 9px 8px;
    text-align: right;
    white-space: nowrap;
}

.cash-flow-horizontal-table th:first-child {
    position: sticky;
    z-index: 2;
    left: 0;
    min-width: 150px;
    background: #fff;
    text-align: left;
}

.cash-flow-horizontal-table .cash-matrix-month-heading {
    min-width: 344px;
    border-left: 2px solid var(--midnight-200);
    text-align: center;
}

.cash-matrix-value-headings th {
    min-width: 86px;
    padding-block: 6px;
    font-size: 10px;
    text-align: right;
}

.cash-matrix-value-headings th:nth-child(4n + 1),
.cash-flow-horizontal-table tbody td:nth-child(4n + 2) {
    border-left: 2px solid var(--midnight-200);
}

.cash-flow-horizontal-table thead th {
    position: sticky;
    z-index: 1;
    top: 0;
    background: var(--midnight-25);
    color: var(--midnight-800);
}

.cash-flow-horizontal-table thead th:first-child {
    z-index: 3;
    background: var(--midnight-50);
}

.cash-flow-horizontal-table thead th.current {
    background: var(--midnight-100);
}

.cash-flow-horizontal-table thead button {
    width: 100%;
    border: 0;
    background: transparent;
    color: inherit;
    font-weight: 800;
}

.cash-flow-horizontal-table thead small {
    display: block;
    margin-top: 2px;
    color: var(--gray);
    font-size: 9px;
}

.cash-matrix-total th,
.cash-matrix-total td {
    background: #fbfcfe;
    font-weight: 800;
}

.cash-matrix-total.balance th,
.cash-matrix-total.balance td,
.cash-flow-horizontal-table tr.balance th,
.cash-flow-horizontal-table tr.balance td {
    border-bottom: 2px solid var(--midnight-200);
}

.cash-matrix-account-heading th {
    position: static !important;
    background: var(--midnight-50) !important;
    color: var(--midnight-800);
    font-size: 11px;
    font-weight: 800;
    text-align: left !important;
}

.cash-matrix-account-row th {
    background: #fff;
    color: var(--midnight-800);
    font-weight: 700;
}

.cash-inline-transactions {
    display: grid;
    gap: 12px;
    margin-top: 18px;
    border-top: 1px solid var(--pale-light-gray);
    padding-top: 18px;
}

.cash-inline-transactions-head,
.cash-inline-transactions-head > div,
.cash-inline-transaction-summary {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.cash-inline-transactions-head h3 {
    margin: 0;
    font-size: 15px;
}

.cash-inline-transactions-head span,
.cash-inline-transaction-summary {
    color: var(--gray);
    font-size: 11px;
}

.cash-inline-transactions-head > div:first-child {
    display: grid;
    justify-items: start;
    gap: 3px;
}

.cash-inline-transaction-summary {
    justify-content: flex-start;
    border-radius: 8px;
    background: var(--paper-white);
    padding: 9px 11px;
}

.cash-inline-transaction-table {
    min-width: 900px;
}

.cash-inline-transaction-table td:nth-child(3) {
    max-width: 260px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cash-load-more {
    justify-self: center;
}

.cash-transaction-workbench {
    display: grid;
    gap: 16px;
}

.cash-transaction-list-card {
    display: grid;
    gap: 14px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 10px;
    background: var(--pure-white);
    padding: 16px;
}

.cash-transaction-list-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.cash-transaction-list-header h3 {
    margin: 0;
    color: var(--midnight-900);
    font-size: 15px;
}

.cash-transaction-list-header > span {
    color: var(--gray);
    font-size: 12px;
}

.cash-transaction-notice {
    margin: 0;
    color: var(--gray);
    font-size: 12px;
}

.cash-transaction-workbench-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
}

.cash-transaction-workbench-header > div:first-child {
    display: grid;
    justify-items: start;
    gap: 6px;
}

.cash-transaction-workbench-header h2,
.cash-transaction-workbench-header p {
    margin: 0;
}

.cash-transaction-workbench-header > div:first-child > span {
    color: var(--gray);
    font-size: 12px;
}

.cash-transaction-period,
.cash-transaction-period label {
    display: flex;
    align-items: center;
    gap: 8px;
}

.cash-transaction-period label span {
    color: var(--gray);
    font-size: 11px;
    font-weight: 700;
}

.cash-transaction-period input {
    min-height: 34px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 5px;
    background: var(--pure-white);
    padding: 6px 9px;
    color: var(--text);
    font: inherit;
}

.cash-transaction-toolbar {
    border-top: 1px solid var(--pale-light-gray);
    border-bottom: 1px solid var(--pale-light-gray);
    margin: 0;
    padding: 12px 0;
}

.cash-transaction-ledger-summary {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 18px;
    color: var(--gray);
    font-size: 12px;
}

.cash-transaction-ledger-summary strong {
    color: inherit;
}

.cash-transaction-ledger-table {
    min-width: 1080px;
}

.cash-transaction-ledger-table td:nth-child(2),
.cash-transaction-ledger-table td:nth-child(8) {
    max-width: 240px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cash-adjustment-status {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    border: 1px solid #badfce;
    border-radius: 9px;
    background: #effaf5;
    padding: 12px 14px;
}

.cash-adjustment-status.needs-action {
    border-color: #efd49a;
    background: #fff8e8;
}

.cash-adjustment-status > div {
    display: grid;
    gap: 4px;
}

.cash-adjustment-status strong {
    font-size: 12px;
}

.cash-adjustment-status span {
    color: var(--gray);
    font-size: 11px;
}

@media (max-width: 1100px) {
    .cash-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .cash-overview-grid,
    .cash-editor-grid,
    .cash-variance-grid {
        grid-template-columns: 1fr;
    }

    .cash-month-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .cash-timeline-panel .panel-header,
    .cash-transaction-workbench-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .cash-timeline-head-actions {
        justify-content: flex-start;
    }

    .cash-timeline-navigation {
        justify-content: flex-start;
    }

}

@media (max-width: 640px) {
    .cash-management-tabs .cash-tab-year-filter {
        width: 100%;
        margin-left: 0;
        padding: 8px 0 0;
    }

    .cash-plan-create-form {
        grid-template-columns: 1fr;
    }

    .cash-summary-grid,
    .cash-form-grid,
    .cash-detail-metrics,
    .cash-month-metrics {
        grid-template-columns: 1fr;
    }

    .cash-period-controls input,
    .cash-period-controls select {
        flex: 1 1 130px;
        width: auto;
    }

    .cash-flow-compare > div {
        grid-template-columns: 76px 100px minmax(60px, 1fr);
    }

    .cash-detail-panel {
        width: 100%;
        padding: 18px;
    }

    .cash-detail-period-filter,
    .cash-adjustment-status {
        align-items: stretch;
        flex-direction: column;
    }

    .cash-inline-transactions-head,
    .cash-inline-transactions-head > div,
    .cash-transaction-period {
        align-items: stretch;
        flex-direction: column;
    }

    .cash-transaction-period,
    .cash-transaction-period label,
    .cash-transaction-period input,
    .cash-transaction-period button {
        width: 100%;
    }

    .cash-transaction-period > span {
        display: none;
    }

}

.classification-workbench {
    display: grid;
    gap: 12px;
    margin-bottom: 16px;
    padding: 0 0 16px;
    border-bottom: 1px solid var(--pale-light-gray);
}

.classification-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.classification-tabs a,
.classification-tabs button {
    min-width: 0;
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 0 12px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 4px;
    background: var(--pure-white);
    color: var(--midnight-800);
    font-size: 12px;
    text-decoration: none;
    cursor: pointer;
}

.classification-tabs a.active,
.classification-tabs button.active {
    border-color: var(--classic-blue);
    color: var(--classic-blue);
    background: var(--classic-blue-25);
}

.classification-tabs strong {
    color: inherit;
    font-size: 12px;
    font-weight: 700;
}

.pre-wrap {
    white-space: pre-wrap;
}

.classification-summary-grid,
.classification-preview-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(120px, 1fr));
    gap: 10px;
}

.classification-summary-grid article,
.classification-preview-grid article,
.classification-assist-grid article {
    padding: 12px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 8px;
    background: var(--pure-white);
}

.classification-summary-grid span,
.classification-preview-grid span,
.classification-assist-grid span {
    display: block;
    color: var(--muted);
    font-size: 12px;
}

.classification-summary-grid strong,
.classification-preview-grid strong {
    font-size: 20px;
}

.auto-preview-table-wrap {
    min-width: 0;
    margin-top: 14px;
}

.compact-table-wrap {
    max-height: 360px;
    overflow: auto;
}

.auto-preview-table {
    min-width: 760px;
}

.auto-preview-table th,
.auto-preview-table td {
    font-size: 12px;
    white-space: nowrap;
}

.auto-preview-table td:nth-child(3),
.auto-preview-table td:nth-child(6) {
    max-width: 220px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.auto-assign-progress {
    display: grid;
    gap: 10px;
    min-width: 0;
    padding: 12px 14px;
    border: 1px solid rgba(32, 128, 141, .24);
    border-radius: 8px;
    background: rgba(32, 128, 141, .06);
}

.auto-assign-progress-copy {
    display: grid;
    gap: 2px;
}

.auto-assign-progress-copy strong {
    color: var(--deep-black);
    font-size: 13px;
}

.auto-assign-progress-copy span {
    color: var(--muted);
    font-size: 12px;
}

.auto-assign-progress-track {
    position: relative;
    overflow: hidden;
    height: 6px;
    border-radius: 999px;
    background: rgba(32, 128, 141, .16);
}

.auto-assign-progress-track span {
    position: absolute;
    inset: 0 auto 0 0;
    width: 42%;
    border-radius: inherit;
    background: var(--emerald-green);
    animation: auto-assign-progress 1.2s ease-in-out infinite;
}

@keyframes auto-assign-progress {
    0% {
        transform: translateX(-110%);
    }

    100% {
        transform: translateX(240%);
    }
}

.classification-modal .classification-preview-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.classification-modal .classification-preview-grid article {
    min-width: 0;
}

.classification-modal .classification-preview-grid strong {
    display: block;
    overflow-wrap: anywhere;
}

.classification-modal .review-empty-state {
    width: 100%;
    min-width: 0;
}

.classification-modal .modal-footer {
    min-width: 0;
}

.classification-modal .modal-footer .btn-primary,
.classification-modal .modal-footer .btn-outline {
    flex: 0 1 auto;
    min-width: 0;
}

.classification-summary-grid small {
    display: block;
    margin-top: 4px;
    color: var(--muted);
    font-size: 11px;
    line-height: 1.4;
}

.classification-assist-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(160px, 1fr));
    gap: 10px;
}

.classification-assist-grid article {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.classification-assist-grid article.review-work-highlight {
    border-color: rgba(32, 128, 141, .32);
    background: rgba(32, 128, 141, .06);
}

.review-empty-state {
    display: grid;
    justify-items: center;
    gap: 8px;
    padding: 28px;
    border: 1px dashed var(--line);
    border-radius: 8px;
    background: #fff;
    color: var(--muted);
    text-align: center;
}

.review-empty-state strong {
    color: var(--text);
}

.review-empty-state.compact {
    padding: 18px;
    border: 0;
}

.table-loading-state {
    justify-items: stretch;
    max-width: 360px;
    margin: 0 auto;
}

.table-loading-state strong,
.table-loading-state span {
    text-align: center;
}

.table-loading-state .auto-assign-progress-track {
    width: 100%;
    margin-top: 2px;
}

.duplicate-review-panel {
    display: grid;
    gap: 14px;
}

.duplicate-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.duplicate-toolbar > div:first-child {
    display: grid;
    gap: 3px;
}

.duplicate-toolbar strong {
    color: var(--text);
    font-size: 15px;
}

.duplicate-toolbar span,
.duplicate-sub-header span,
.duplicate-match-main small {
    color: var(--muted);
    font-size: 12px;
}

.duplicate-filter-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.duplicate-action-toolbar {
    align-items: center;
}

.duplicate-group-list {
    display: grid;
    gap: 12px;
}

.duplicate-group-card {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--pure-white);
}

.duplicate-group-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 12px 14px;
    border-bottom: 1px solid var(--line);
    background: rgba(32, 128, 141, .05);
}

.duplicate-group-header div {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.duplicate-group-header strong {
    overflow: hidden;
    color: var(--text);
    font-size: 15px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.duplicate-group-header span {
    color: var(--muted);
    font-size: 12px;
}

.duplicate-group-table {
    overflow: auto;
}

.duplicate-group-table table {
    min-width: 980px;
}

.duplicate-group-table td:nth-child(5) {
    min-width: 220px;
    max-width: 320px;
}

.duplicate-group-table td:nth-child(5) strong,
.duplicate-group-table td:nth-child(5) span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.duplicate-group-table td:nth-child(5) span {
    margin-top: 3px;
    color: var(--muted);
    font-size: 12px;
}

.duplicate-main-row td {
    background: rgba(32, 128, 141, .05);
    font-weight: 600;
}

.duplicate-support-row td:first-child {
    text-align: center;
}

.duplicate-match-list {
    display: grid;
    gap: 12px;
}

.duplicate-match-card {
    display: grid;
    grid-template-columns: minmax(260px, 3fr) minmax(420px, 5fr);
    gap: 0;
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--pure-white);
}

.duplicate-match-main {
    display: grid;
    align-content: start;
    gap: 12px;
    min-width: 0;
    padding: 14px;
    border-right: 1px solid var(--line);
    background: rgba(32, 128, 141, .05);
}

.duplicate-match-role {
    display: grid;
    gap: 5px;
    min-width: 0;
}

.duplicate-match-role strong {
    overflow: hidden;
    color: var(--text);
    font-size: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.duplicate-match-facts {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.duplicate-match-facts span {
    padding: 3px 7px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fff;
    color: var(--muted);
    font-size: 12px;
}

.duplicate-match-facts strong {
    margin-left: auto;
    font-size: 15px;
}

.duplicate-match-main p {
    margin: 0;
    color: var(--text);
    font-size: 13px;
    line-height: 1.45;
}

.duplicate-match-subs {
    display: grid;
    gap: 0;
    min-width: 0;
}

.duplicate-sub-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 12px 14px;
    border-bottom: 1px solid var(--line);
}

.duplicate-sub-table {
    max-height: 260px;
    overflow: auto;
}

.duplicate-sub-table table {
    min-width: 720px;
}

.proof-review-panel {
    display: grid;
    gap: 14px;
}

.proof-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.proof-toolbar-group {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.proof-review-grid {
    display: grid;
    grid-template-columns: minmax(320px, 5fr) minmax(420px, 7fr);
    gap: 16px;
}

.proof-review-table-card {
    min-width: 0;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fff;
}

.proof-table-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 12px;
    border-bottom: 1px solid var(--line);
}

.proof-table-header span {
    display: block;
    margin-top: 3px;
    color: var(--muted);
    font-size: 12px;
}

.proof-table-header .badge {
    display: inline-flex;
    margin-top: 0;
}

.compact-proof-table {
    max-height: 560px;
    overflow: auto;
}

.data-table tr.selected-row td {
    background: rgba(32, 128, 141, .1);
}

.transaction-selection-table tbody tr.selectable-row {
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
}

.transaction-selection-table tbody tr.selectable-row[draggable="true"] {
    cursor: grab;
}

.transaction-selection-table tbody tr.selectable-row[draggable="true"]:active {
    cursor: grabbing;
}

.transaction-date-cell {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    white-space: nowrap;
}

.transaction-drag-handle {
    display: inline-grid;
    width: 16px;
    height: 20px;
    place-items: center;
    color: var(--mid-gray);
    cursor: grab;
}

.transaction-selection-table tbody tr[draggable="true"]:active .transaction-drag-handle {
    cursor: grabbing;
    color: var(--classic-blue);
}

.transaction-selection-table tbody tr.selectable-row:hover td {
    background: var(--classic-blue-25);
}

.transaction-selection-table tbody tr.selectable-row.selected-row:hover td {
    background: rgba(32, 128, 141, .12);
}

.transaction-selection-table tbody tr.selectable-row:focus-visible {
    outline: 0;
}

.transaction-selection-table tbody tr.selectable-row:focus-visible td {
    background: var(--midnight-25);
    box-shadow: inset 0 1px 0 var(--midnight-300), inset 0 -1px 0 var(--midnight-300);
}

.transaction-selection-table tbody tr.selectable-row.selected-row td:first-child {
    box-shadow: inset 3px 0 0 var(--classic-blue);
}

.btn-outline.active {
    border-color: var(--classic-blue);
    background: var(--classic-blue-25);
    color: var(--classic-blue);
}

.subject-drop-panel {
    position: fixed;
    z-index: 1201;
    top: 16px;
    left: 16px;
    display: grid;
    grid-template-rows: auto auto auto minmax(0, 1fr) auto;
    width: min(280px, calc(100vw - 32px));
    max-height: calc(100vh - 32px);
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 18px 48px rgba(16, 36, 52, .2);
}

.classification-review-tabs {
    margin: 0;
    padding: 0;
}

.classification-ledger-layout {
    display: grid;
    grid-template-columns: 320px minmax(0, 1fr);
    align-items: start;
    gap: 16px;
}

.classification-ledger-main {
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
}

.classification-render-limit {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 16px 12px 4px;
    color: var(--muted);
    font-size: 13px;
}

.subject-drop-panel.docked {
    grid-column: 1;
    grid-row: 1;
    position: sticky;
    display: flex;
    flex-direction: column;
    z-index: 5;
    top: 16px;
    right: auto;
    bottom: auto;
    left: auto;
    width: 100%;
    max-height: calc(100vh - 32px);
    border-radius: 10px;
    box-shadow: 0 8px 24px rgba(16, 36, 52, .12);
}

.subject-drop-panel.docked .subject-drop-list {
    flex: 1 1 auto;
    min-height: 120px;
}

.subject-drop-panel.docked > :not(.subject-drop-list) {
    flex: 0 0 auto;
}

.subject-drop-panel.is-dragging {
    border-color: var(--classic-blue);
    box-shadow: 0 20px 56px rgba(32, 128, 141, .28), 0 0 0 3px rgba(32, 128, 141, .12);
}

.subject-drop-panel-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 16px 12px;
}

.subject-drop-panel-header > div {
    display: flex;
    align-items: baseline;
    gap: 8px;
    min-width: 0;
}

.subject-drop-panel-header strong {
    color: var(--midnight-900);
    font-size: 17px;
}

.subject-drop-eyebrow {
    color: var(--classic-blue);
    font-size: 10px;
    font-weight: 700;
    white-space: nowrap;
}

.subject-drop-action-group {
    display: grid;
    gap: 10px;
    margin: 0 12px;
    padding: 12px;
    border: 1px solid rgba(0, 76, 151, .16);
    border-radius: 10px;
    background: rgba(0, 76, 151, .035);
}

.subject-drop-selection {
    display: flex;
    align-items: baseline;
    gap: 8px;
    min-width: 0;
}

.subject-drop-selection strong {
    color: var(--midnight-900);
    font-size: 13px;
}

.subject-drop-action-status-row {
    padding: 2px 0;
}

.subject-drop-action-status-row > span {
    flex: 0 0 auto;
    color: var(--muted);
    font-size: 10px;
}

.subject-drop-tools {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 112px;
    gap: 8px;
    padding: 12px;
}

.subject-drop-search {
    width: 100%;
    min-width: 0;
}

.subject-drop-tools .subject-drop-search {
    width: 100%;
    min-width: 0;
    max-width: none;
}

.subject-drop-tools .subject-drop-search .search-input-control {
    min-width: 0;
    max-width: 100%;
}

.subject-drop-tools .select-small {
    width: 100%;
    max-width: 128px;
}

.subject-drop-filter-summary {
    grid-column: 1 / -1;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    margin-bottom: 2px;
    min-height: 28px;
    color: var(--muted);
    font-size: 11px;
}

.subject-drop-filter-summary-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    max-width: 100%;
    height: 28px;
    padding: 3px 7px;
    border: 1px solid var(--pale-gray);
    border-radius: 999px;
    background: #fff;
    color: var(--classic-blue);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.subject-drop-filter-summary-chip:hover {
    border-color: var(--classic-blue);
    background: var(--classic-blue-25);
}

.subject-drop-filter-summary-text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.subject-category-filter {
    display: flex;
    flex: 0 0 auto;
    gap: 6px;
    min-height: 38px;
    padding: 0 12px 10px;
    overflow-x: auto;
    overflow-y: hidden;
    background: #fff;
}

.subject-category-filter button {
    flex: 0 0 auto;
    min-height: 28px;
    padding: 4px 9px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: #fff;
    color: var(--muted);
    font-size: 11px;
}

.subject-category-filter button.active {
    border-color: var(--classic-blue);
    background: var(--classic-blue-25);
    color: var(--classic-blue);
    font-weight: 700;
}

.subject-drop-list {
    min-height: 120px;
    overflow: auto;
    padding: 0 12px 12px;
}

.subject-drop-item {
    display: flex;
    align-items: center;
    gap: 2px;
    width: 100%;
    min-height: 54px;
    padding: 0;
    border: 1px solid transparent;
    border-bottom-color: var(--pale-light-gray);
    background: #fff;
    color: var(--text);
    text-align: left;
    transition: border-color .12s ease, background-color .12s ease, transform .12s ease;
}

.subject-drop-item:hover:not(:disabled) {
    border-color: rgba(32, 128, 141, .35);
    border-radius: 7px;
    background: var(--classic-blue-25);
}

.subject-drop-item.is-selected {
    border-color: var(--emerald-green);
    border-radius: 7px;
    background: rgba(0, 152, 116, .08);
}

.subject-drop-panel.is-dragging .subject-drop-item:not(:disabled) {
    border-color: var(--pale-light-gray);
    border-radius: 7px;
    margin-bottom: 4px;
}

.subject-drop-item.is-drop-target:not(:disabled) {
    border-color: var(--classic-blue);
    background: rgba(32, 128, 141, .14);
    transform: translateX(-3px);
}

.subject-drop-item:disabled {
    cursor: not-allowed;
    opacity: .5;
}

.subject-drop-item.is-disabled {
    opacity: 1;
}

.subject-drop-panel.is-dragging .subject-drop-item.is-disabled .subject-drop-select {
    opacity: 1;
}

.subject-drop-select {
    display: flex;
    flex: 1 1 auto;
    align-items: center;
    gap: 10px;
    min-width: 0;
    min-height: 52px;
    padding: 9px 8px 9px 10px;
    border: 0;
    background: transparent;
    color: inherit;
    text-align: left;
}

.subject-drop-select:disabled {
    cursor: not-allowed;
    opacity: .45;
}

.subject-drop-filter {
    display: inline-grid;
    flex: 0 0 34px;
    place-items: center;
    width: 34px;
    height: 34px;
    margin-right: 7px;
    border: 1px solid var(--pale-gray);
    border-radius: 6px;
    background: #fff;
    color: var(--muted);
}

.subject-drop-filter:hover,
.subject-drop-filter[aria-pressed="true"] {
    border-color: var(--classic-blue);
    background: rgba(0, 76, 151, .08);
    color: var(--classic-blue);
}

.subject-drop-item.is-filtered:not(.is-selected) {
    background: rgba(0, 76, 151, .035);
}

.subject-drop-item-copy {
    display: grid;
    flex: 1 1 auto;
    gap: 3px;
    min-width: 0;
}

.subject-drop-item-copy strong,
.subject-drop-item-copy small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.subject-drop-item-copy strong {
    font-size: 13px;
}

.subject-drop-item-copy small {
    color: var(--muted);
    font-size: 11px;
}

.subject-use-count {
    flex: 0 0 auto;
    padding: 2px 6px;
    border-radius: 999px;
    background: var(--surface);
    color: var(--muted);
    font-size: 10px;
}

.subject-drop-empty {
    display: grid;
    gap: 5px;
    padding: 28px 12px;
    color: var(--muted);
    font-size: 12px;
    text-align: center;
}

.subject-drop-empty strong {
    color: var(--text);
    font-size: 13px;
}

.subject-drop-footer {
    display: flex;
    align-items: flex-start;
    gap: 7px;
    padding: 0;
    color: var(--muted);
    font-size: 11px;
    line-height: 16px;
}

.subject-drop-footer .dr-icon {
    flex: 0 0 auto;
    margin-top: 1px;
}

.subject-drop-apply-footer {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
}

.subject-drop-apply-footer > div {
    grid-column: 1 / -1;
}

.subject-drop-apply-target {
    display: flex;
    align-items: baseline;
    gap: 8px;
    min-width: 0;
}

.subject-drop-apply-target span {
    flex: 0 0 auto;
    color: var(--muted);
    font-size: 10px;
}

.subject-drop-apply-target strong {
    min-width: 0;
    overflow: hidden;
    color: var(--midnight-900);
    font-size: 13px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.subject-drop-apply-footer .btn-small {
    width: 100%;
    min-width: 0;
    padding-inline: 6px;
    white-space: nowrap;
}

.classification-cell {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    max-width: 220px;
    min-width: 0;
}

.classification-cell strong {
    min-width: 0;
    overflow: hidden;
    font-weight: 700;
    font-size: 13px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.classification-cell .badge {
    flex: 0 0 auto;
    padding: 0 6px;
    font-size: 10px;
}

.table-review-icon {
    flex: 0 0 auto;
    color: var(--gray);
}

.table-header-with-legend,
.table-header-legend {
    display: inline-flex;
    align-items: center;
}

.table-header-with-legend {
    gap: 7px;
    white-space: nowrap;
}

.table-header-legend {
    gap: 3px;
    color: var(--gray);
    font-size: 10px;
    font-weight: 500;
}

.table-header-legend .ds-icon {
    flex: 0 0 auto;
}

.table-meta-value {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: var(--midnight-700);
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}

.table-meta-value .ds-icon {
    flex: 0 0 auto;
    color: var(--gray);
}

.table-meta-value.attention,
.table-meta-value.attention .ds-icon,
.projection-sync-icon.danger {
    color: var(--deep-rose);
}

.table-meta-value.caution {
    color: var(--gold-700);
}

.table-empty-value {
    color: var(--muted);
}

.compact-action {
    min-height: 32px;
    padding: 0 10px;
    font-size: 12px;
}

.classification-modal {
    width: min(760px, calc(100vw - 32px));
    max-height: calc(100vh - 48px);
    overflow: auto;
    grid-template-columns: minmax(0, 1fr);
}

.selection-edit-modal {
    gap: 16px;
    padding: 24px 32px 20px;
}

.selection-edit-modal .modal-header {
    align-items: flex-start;
}

.selection-edit-modal .modal-header .icon-button {
    flex: 0 0 auto;
    width: 32px;
    height: 32px;
    border: 1px solid transparent;
    border-radius: 2px;
    color: var(--midnight-900);
    background: transparent;
}

.selection-edit-modal .modal-header .icon-button:hover {
    border-color: var(--pale-gray);
    background: #f9fbfd;
}

.classification-option-list {
    display: grid;
    gap: 8px;
    margin: 4px 0 14px;
}

.classification-option-list.compact {
    margin-top: 12px;
}

.classification-option-list label {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--text);
    font-size: 13px;
}

.classification-target-summary {
    display: grid;
    gap: 5px;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface);
}

.classification-target-summary span {
    color: var(--muted);
    font-size: 12px;
}

.subject-pick-search {
    width: 100%;
    margin: 12px 0;
}

.subject-pick-section {
    display: grid;
    gap: 12px;
    min-width: 0;
}

.subject-pick-section + .subject-pick-section {
    padding-top: 12px;
    border-top: 1px solid var(--pale-light-gray);
}

.subject-pick-section-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    min-width: 0;
}

.subject-pick-section-head h3 {
    margin: 0;
    color: var(--midnight-900);
    font-size: 13px;
    line-height: 18px;
}

.subject-pick-section-head span {
    min-width: 0;
    overflow: hidden;
    color: var(--muted);
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.subject-suggestion-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.subject-suggestion-list button {
    display: grid;
    gap: 4px;
    min-height: 58px;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fff;
    color: var(--text);
    text-align: left;
}

.subject-suggestion-list button.active {
    border-color: var(--accent);
    background: rgba(32, 128, 141, .08);
}

.subject-suggestion-list span {
    color: var(--muted);
    font-size: 12px;
}

.subject-rule-section .classification-option-list.compact {
    margin: 0;
}

.rule-form-grid {
    min-height: 48px;
}

.rule-form-grid .rule-keyword-field {
    grid-column: 1 / -1;
}

.rule-form-grid.is-muted {
    display: flex;
    align-items: center;
}

.rule-summary-placeholder {
    width: 100%;
    min-height: 32px;
    padding: 8px 12px;
    border: 1px dashed var(--pale-gray);
    border-radius: 6px;
    background: #fbfcff;
    color: var(--muted);
    font-size: 12px;
    line-height: 16px;
}

.selection-edit-modal .selection-edit-footer {
    position: sticky;
    z-index: 1;
    bottom: -20px;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    margin: 0 -32px -20px;
    padding: 14px 32px 20px;
    border-top: 1px solid var(--pale-light-gray);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.92), var(--paper-white) 28%);
}

.selection-edit-modal .selection-edit-footer .btn-medium {
    min-width: 120px;
}

.selection-edit-modal .selection-edit-footer .btn-primary {
    min-width: 150px;
}

.figma-modal.batch-assign-modal {
    width: min(820px, calc(100vw - 32px));
}

.projection-action-button {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-height: 24px;
    padding: 0;
    border: 0;
    border-radius: 12px;
    background: transparent;
    color: var(--midnight-800);
    font: inherit;
    cursor: pointer;
}

.projection-action-button:hover,
.projection-action-button:focus-visible {
    outline: none;
    box-shadow: 0 0 0 2px rgba(32, 128, 141, .12);
}

.projection-action-button:hover .badge {
    filter: brightness(.96);
}

.projection-sync-icon {
    color: var(--gold-700);
}

.supplementary-projection-editor {
    width: min(820px, calc(100vw - 32px));
    max-height: calc(100vh - 48px);
    overflow: auto;
    grid-template-columns: minmax(0, 1fr);
    gap: 18px;
    padding: 28px 32px 24px;
}

.supplementary-projection-editor > .modal-header {
    align-items: flex-start;
    min-height: 64px;
    padding-bottom: 2px;
}

.supplementary-projection-editor > .modal-header > div {
    min-width: 0;
}

.supplementary-projection-editor > .modal-header h2 {
    margin: 0 0 2px;
    color: var(--deep-black);
    font-size: 24px;
    line-height: 32px;
    overflow-wrap: anywhere;
}

.supplementary-editor-meta {
    display: block;
    color: var(--deep-black);
    font-size: 15px;
    line-height: 22px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.supplementary-projection-editor .subject-pick-section {
    gap: 14px;
    padding-top: 18px;
    border-top: 1px solid var(--pale-light-gray);
}

.supplementary-projection-editor .subject-pick-section:first-of-type {
    padding-top: 0;
    border-top: 0;
}

.supplementary-projection-editor .subject-pick-section-head h3 {
    color: var(--midnight-900);
    font-size: 18px;
    line-height: 26px;
}

.supplementary-projection-editor .subject-pick-section-head span {
    font-size: 14px;
}

.supplementary-projection-editor .field {
    gap: 6px;
    font-size: 14px;
}

.supplementary-projection-editor .field > span {
    font-size: 14px;
    color: var(--midnight-900);
}

.supplementary-projection-editor .input-small {
    min-height: 40px;
    padding: 8px 12px;
    font-size: 14px;
}

.supplementary-projection-editor .classification-option-list.compact {
    gap: 12px;
}

.supplementary-projection-editor .classification-option-list.compact label {
    color: var(--deep-black);
    font-size: 15px;
}

.supplementary-projection-editor .selection-edit-footer {
    margin-top: 2px;
    padding-top: 20px;
    border-top: 1px solid var(--pale-light-gray);
}

.supplementary-split-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 16px;
}

.supplementary-editor-error,
.supplementary-editor-warning {
    margin: 0;
    padding: 10px 12px;
    border-radius: 7px;
    font-size: 12px;
    line-height: 18px;
}

.supplementary-editor-error {
    border: 1px solid #f3b7b7;
    background: #fff4f4;
    color: #9c2525;
}

.supplementary-editor-warning {
    border: 1px solid #edd59b;
    background: #fff9e9;
    color: #785915;
}

.batch-assign-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.batch-assign-summary article {
    display: grid;
    gap: 6px;
    min-width: 0;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #fbfcff;
}

.batch-assign-summary span,
.batch-assign-preview-list span {
    color: var(--muted);
    font-size: 12px;
}

.batch-assign-summary strong {
    overflow-wrap: anywhere;
    color: var(--text);
    font-size: 18px;
    line-height: 24px;
}

.batch-assign-impact {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 10px 12px;
    border-radius: 8px;
    background: var(--midnight-25);
    color: var(--midnight-800);
}

.batch-assign-impact .ds-icon {
    flex: 0 0 auto;
    margin-top: 1px;
}

.batch-assign-impact p {
    color: var(--midnight-800);
    font-size: 12px;
    line-height: 18px;
}

.batch-assign-preview-list {
    display: grid;
    gap: 6px;
    padding: 10px 12px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 8px;
    background: var(--pure-white);
}

.batch-assign-preview-list div {
    display: grid;
    grid-template-columns: minmax(120px, .55fr) minmax(0, 1fr);
    gap: 10px;
    min-width: 0;
}

.batch-assign-preview-list strong,
.batch-assign-preview-list span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

* {
    box-sizing: border-box;
}

html,
body {
    min-height: 100%;
    margin: 0;
    background: var(--pure-white);
    color: var(--deep-black);
    font-family: var(--font-body);
    font-size: 16px;
    letter-spacing: 0;
}

.d-flex {
  display: flex !important;
}

.d-inline-flex {
  display: inline-flex !important;
}

.d-none {
  display: none !important;
}
.flex-fill {
  flex: 1 1 auto !important;
}

.flex-row {
  flex-direction: row !important;
}

.flex-column {
  flex-direction: column !important;
}

.flex-row-reverse {
  flex-direction: row-reverse !important;
}

.flex-column-reverse {
  flex-direction: column-reverse !important;
}

.gap-0 {
  gap: 0 !important;
}

.gap-1 {
  gap: 0.25rem !important;
}

.gap-2 {
  gap: 0.5rem !important;
}

.gap-3 {
  gap: 1rem !important;
}

a {
    color: inherit;
    text-decoration: none;
}

button,
input,
select {
    font: inherit;
}

input[type="checkbox"] {
    appearance: none;
    display: inline-grid;
    place-content: center;
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    margin: 0;
    border: 1px solid var(--midnight-800);
    border-radius: 1px;
    background: var(--pure-white);
    cursor: pointer;
    transition: background-color 120ms ease, border-color 120ms ease, box-shadow 120ms ease;
}

input[type="checkbox"]::before {
    content: "";
    width: 10px;
    height: 8px;
    transform: scale(0);
    background-color: var(--pure-white);
    clip-path: polygon(12% 46%, 0 60%, 38% 100%, 100% 18%, 86% 4%, 37% 70%);
    transition: transform 120ms ease;
}

input[type="checkbox"]:checked {
    border-color: var(--midnight-800);
    background: var(--midnight-800);
}

input[type="checkbox"]:checked::before {
    transform: scale(1);
}

input[type="checkbox"]:focus-visible {
    outline: 2px solid var(--midnight-300);
    outline-offset: 2px;
}

input[type="checkbox"]:disabled {
    border-color: var(--pale-light-gray);
    background: var(--pale-light-gray);
    cursor: not-allowed;
}

/* Design system: 목록과 데이터 표에서 사용하는 선택 체크박스 */
:root {
    --selection-checkbox-size: 14px;
    --selection-checkbox-mark-width: 8px;
    --selection-checkbox-mark-height: 6px;
}

:is(table, [role="table"], [role="grid"], .pair-selector, .card-selection, .select-column) input[type="checkbox"],
input[type="checkbox"][aria-label*="선택"] {
    width: var(--selection-checkbox-size);
    height: var(--selection-checkbox-size);
    flex: 0 0 var(--selection-checkbox-size);
}

:is(table, [role="table"], [role="grid"], .pair-selector, .card-selection, .select-column) input[type="checkbox"]::before,
input[type="checkbox"][aria-label*="선택"]::before {
    width: var(--selection-checkbox-mark-width);
    height: var(--selection-checkbox-mark-height);
}

input[type="radio"] {
    accent-color: var(--midnight-800);
}

button,
select,
a,
input {
    outline-color: var(--midnight-600);
}

.app-shell {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);
    min-height: 100vh;
    background: var(--pure-white);
}

.app-shell.sidebar-collapsed {
    grid-template-columns: 72px minmax(0, 1fr);
}

.sidebar {
    position: sticky;
    top: 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
    height: 100vh;
    padding: 16px;
    background: var(--paper-white);
    border-right: 1px solid #f0f1f2;
}

.sidebar.collapsed {
    align-items: center;
    gap: 12px;
    padding: 16px 12px;
}

.sidebar.collapsed .doctor-card {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.sidebar.collapsed .doctor-copy,
.sidebar.collapsed .segmented,
.sidebar.collapsed .btn-large span,
.sidebar.collapsed .nav-list span:not(.sr-only),
.sidebar.collapsed .nav-section a,
.sidebar.collapsed .nav-action-icon,
.sidebar.collapsed .sidebar-footer span,
.sidebar.collapsed .sidebar-footer strong {
    display: none;
}

.sidebar.collapsed .avatar-wrap,
.sidebar.collapsed .brand-mark {
    width: 44px;
    height: 44px;
}

.sidebar.collapsed .btn-large,
.sidebar.collapsed .nav-list a,
.sidebar.collapsed .nav-section-title,
.sidebar.collapsed .sidebar-footer a,
.sidebar.collapsed .sidebar-footer .sidebar-footer-action {
    width: 44px;
    min-height: 44px;
    padding: 0;
    justify-content: center;
}

.sidebar.collapsed .nav-list {
    width: 100%;
    align-items: center;
}

.sidebar.collapsed .nav-section {
    width: 100%;
    justify-items: center;
}

.sidebar.collapsed .sidebar-footer {
    align-items: center;
}

.ledger-workspace {
    padding: 30px 32px 24px;
}

.ledger-workspace.source-ledger-detail-workspace {
    padding-top: 0;
}

.doctor-card {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    gap: 8px;
    align-items: start;
}

.avatar-wrap,
.brand-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 24px;
    background: var(--hospital-sky);
}

.avatar-wrap.admin {
    background: var(--midnight-800);
}

.avatar-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.icon-button img {
    object-fit: contain;
}

.doctor-copy {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
    color: var(--midnight-900);
    font-size: 14px;
    line-height: 21px;
}

.doctor-name-row {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
}

.doctor-name-row strong {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.doctor-copy span,
.badge.gold {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 24px;
    padding: 4px 12px;
    border-radius: 12px;
    background: var(--gold-100);
    color: var(--gold-600);
    font-size: 10px;
    font-weight: 700;
    line-height: 10px;
    gap: 4px;
}
.doctor-copy span img {
    width: 1rem;
    height: 1rem;
    filter: brightness(0) saturate(100%) invert(50%) sepia(7%) saturate(3257%) hue-rotate(0deg) brightness(106%) contrast(88%);
}

.doctor-session-row {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
}

.doctor-session-label {
    flex: 1 1 auto;
    min-width: 0;
    justify-content: flex-start;
}

.doctor-session-label em {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-style: normal;
}

.sidebar-profile-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 28px;
    width: 28px;
    height: 28px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 14px;
    background: var(--pure-white);
}

.sidebar-profile-action img {
    width: 16px;
    height: 16px;
}

.segmented {
    display: grid;
    grid-template-columns: 1fr 1fr;
    height: 28px;
    padding: 2px;
    border-radius: 14px;
    background: var(--midnight-800);
}

.segmented button {
    border: 0;
    border-radius: 13px;
    background: transparent;
    color: var(--midnight-100);
    cursor: pointer;
    font-size: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
}
.segmented button img {
    width: 1rem;
    height: 1rem;
    filter: brightness(0) saturate(100%) invert(91%) sepia(4%) saturate(1067%) hue-rotate(187deg) brightness(98%) contrast(90%);
}
.segmented button.active img {
    filter: brightness(0) saturate(100%) invert(10%) sepia(66%) saturate(1989%) hue-rotate(212deg) brightness(100%) contrast(104%);
}

.segmented button.active {
    background: var(--pure-white);
    color: var(--midnight-900);
    box-shadow: var(--shadow-100);
}

.btn,
.btn-outline,
.btn-primary,
.chip,
.btn-link{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-weight: 600;
    border: 1px solid transparent;
    border-radius: 2px;
    transition: background-color 120ms ease, border-color 120ms ease, color 120ms ease, box-shadow 120ms ease;
    text-decoration: none;
}

.btn-primary {
    background: var(--midnight-800);
    color: var(--pure-white);
    border-color: transparent;
}
.btn-primary:hover {
    background: var(--midnight-700);
}

.btn-primary:focus, .btn-primary:active {
    background: var(--midnight-600);
}
.btn-primary[disabled] {
    background: var(--midnight-200);
    cursor: not-allowed;
}

.import-file-button {
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

.import-file-input {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
}

.import-panel {
    gap: 16px;
}

.import-summary {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.import-status {
    margin: 0;
    color: var(--text-secondary);
    font-size: 14px;
}

.btn-outline {
    background: var(--pure-white);
    color: var(--midnight-800);
    border-color: var(--midnight-800);
}
.btn-outline:hover {
    background: var(--midnight-15);
    color: var(--midnight-700);
    border-color: var(--midnight-700);
}
.btn-outline:focus, .btn-outline:active {
    background: var(--midnight-25);
    color: var(--midnight-600);
    border-color: var(--midnight-600);
}
.btn-outline[disabled] {
    background: var(--midnight-15);
    color: var(--midnight-200);
    border-color: var(--midnight-200);
    cursor: not-allowed;
}

.btn-link {
    display: inline-flex;
    align-items: center;
    color: var(--midnight-800);
    padding: 0;
    font-weight: 600;
    background: transparent;
    border-color: transparent;
}

.btn-link span {
    position: relative;
}

.btn-link span::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -2px;
    height: 1px;
    background: var(--midnight-800);
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 180ms ease, background-color 180ms ease;
}

.btn-link:hover {
    color: var(--midnight-700);
}

.btn-link:hover span::after {
    transform: scaleX(1);
    background: var(--midnight-700);
}

.btn-link:focus, .btn-link:active {
    color: var(--midnight-600);
}

.btn-link:focus span::after,
.btn-link:active span::after {
    transform: scaleX(1);
    background: var(--midnight-600);
}

.btn-link[disabled] {
    color: var(--midnight-200);
    cursor: not-allowed;
}

.btn-link[disabled] span::after {
    transform: scaleX(0);
}
.btn-link.btn-large {
    font-size: 1rem;
    line-height: 1;
    gap: 4px;
}
.btn-link.btn-large img {
    width: 1rem;
    height: 1rem;
}
.btn-link.btn-medium {
    font-size: 0.875rem;
    line-height: 1;
    gap: 4px;
}
.btn-link.btn-medium img {
    width: 0.875rem;
    height: 0.875rem;
}
.btn-link.btn-small {
    font-size: 0.75rem;
    line-height: 1;
    gap: 2px;
}
.btn-link.btn-small img {
    width: 0.75rem;
    height: 0.75rem;
}

.btn-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    padding: 6px;
    border: 0;
    background: transparent;
    cursor: pointer;
    filter: brightness(0) saturate(100%) invert(65%) sepia(16%) saturate(169%) hue-rotate(166deg) brightness(90%) contrast(86%);
}
.btn-icon img {
    width: 16px;
    height: 16px;
}
.btn-icon:hover {
    filter: brightness(0) saturate(100%) invert(22%) sepia(9%) saturate(3732%) hue-rotate(179deg) brightness(91%) contrast(90%);
}
.btn-icon[disabled] {
    filter: brightness(0) saturate(100%) invert(85%) sepia(5%) saturate(1910%) hue-rotate(187deg) brightness(94%) contrast(87%);
    cursor: not-allowed;
}
.btn-icon.btn-large {
    width: 48px;
    height: 48px;
    padding: 12px;
}
.btn-icon.btn-large img {
    width: 24px;
    height: 24px;
}
.btn-icon.btn-medium {
    width: 36px;
    height: 36px;
    padding: 9px;
}
.btn-icon.btn-medium img {
    width: 18px;
    height: 18px;
}
.btn-icon.btn-small {
    width: 28px;
    height: 28px;
    padding: 6px;
}
.btn-icon.btn-small img,
.btn-small img {
    width: 16px;
    height: 16px;
}

.btn-icon.notification {
    width: 44px;
    height: 44px;
}

.icon-button {
    width: 32px;
    height: 32px;
    min-height: 32px;
    padding: 0;
    border-color: transparent;
    background: transparent;
}

.btn-large,
.field.field-large .input-large,
.input-large {
    min-height: 48px;
    padding: 0 20px;
    font-size: 1rem;
    line-height: 1;
    border-radius: 2px;
    gap: 16px;
}

.btn-medium,
.field.field-medium .input-medium,
.input-medium {
    min-height: 36px;
    padding: 0 18px;
    font-size: 0.875rem;
    line-height: 1;
    gap: 12px;
}

.btn-small,
.field.field-small .input-small,
.input-small {
    min-height: 28px;
    padding: 0 14px;
    font-size: 0.75rem;
    line-height: 1;
    gap: 8px;
}

.icon-white {
    filter: brightness(0) invert(1);
}

.nav-list {
    display: flex;
    flex-direction: column;
    gap: 2px;
    border-top: 1px solid var(--pale-light-gray);
    border-bottom: 1px solid var(--pale-light-gray);
    padding-top: 8px;
    height: 100%;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--mid-gray) transparent;
}
.nav-divider {
  border: none;    
  border-top: 1px solid var(--pale-light-gray);
  margin: 0;
}

.nav-list::-webkit-scrollbar {
    width: 4px;
    scrollbar-width: thin;
}

.nav-list::-webkit-scrollbar-track {
    background: transparent;
}

.nav-list::-webkit-scrollbar-thumb {
    background-color: var(--pale-gray);
    border-radius: 3px;
}

.nav-list a {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 48px;
    padding: 8px;
    border-radius: 2px;
    color: var(--gray);
    font-size: 16px;
    font-weight: 600;
}
.nav-list a:hover {
    color: var(--deep-black);
}
.nav-list a img {
    filter: brightness(0) saturate(100%) invert(40%) sepia(9%) saturate(757%) hue-rotate(167deg) brightness(93%) contrast(89%);
}
.nav-list a.active {
    background: var(--pure-white);
    color: var(--deep-black);
}

.nav-icon {
    flex: 0 0 auto;
    width: 24px;
    height: 24px;
    object-fit: contain;
}

.nav-section {
    display: grid;
    gap: 2px;
    padding: 10px 0;
}

.nav-submenu {
    display: contents;
}

.nav-section-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    min-height: 34px;
    padding: 4px 8px;
    border: 0;
    background: transparent;
    color: var(--gray);
    font-size: 1rem;
    font-weight: 600;
    text-align: left;
    cursor: pointer;
}

.nav-section-title:hover {
    color: var(--deep-black);
}

.nav-section.has-active > .nav-section-title {
    background: var(--pure-white);
    color: var(--deep-black);
}

.nav-section-title:focus-visible {
    outline: 2px solid var(--classic-blue);
    outline-offset: 2px;
}
.nav-section-title .nav-icon {
    filter: brightness(0) saturate(100%) invert(40%) sepia(6%) saturate(1144%) hue-rotate(168deg) brightness(94%) contrast(93%);
}
.nav-list a.active > .nav-icon,
.nav-list a:hover > .nav-icon,
.nav-section-title:hover .nav-icon {
    filter: brightness(0) saturate(100%) invert(0%) sepia(7%) saturate(5658%) hue-rotate(113deg) brightness(135%) contrast(80%);
}

.nav-title-copy {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.nav-action-icon {
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    object-fit: contain;
}

.nav-section a {
    min-height: 36px;
    padding-left: 38px;
    font-size: 14px;
    font-weight: 500;
}

.nav-item-row {
    display: flex;
    align-items: center;
    gap: 6px;
    padding-right: 8px;
    border-radius: 2px;
}

.nav-item-row:hover,
.nav-item-row:hover a,
.nav-item-row.active,
.nav-item-row.active > a {
    background: var(--pure-white);
    color: var(--deep-black);
    position: relative;
}

.nav-item-row a {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    min-height: 36px;
    padding-left: 38px;
    padding-right: 8px;
    font-size: 14px;
    font-weight: 500;
}

.nav-item-row.active > a::before {
    content: "";
    position: absolute;
    left: 18px;
    width: 5px;
    height: 5px;
    border-radius: 4px;
    background: var(--midnight-600);
}

.nav-item-row.active > a:hover,
.nav-item-row.active > a:focus-visible {
    background: var(--pure-white);
}

.nav-favorite-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    cursor: pointer;
    border: none;
    background: transparent;
}


.nav-favorite-toggle img {
    width: 16px;
    height: 16px;
    filter: brightness(0) saturate(100%) invert(65%) sepia(6%) saturate(456%) hue-rotate(166deg) brightness(91%) contrast(89%);
    opacity: 0.7;
}

.nav-favorite-toggle:hover img {
    opacity: 1;
}


.nav-favorite-toggle.active img {
    filter: brightness(0) saturate(100%) invert(65%) sepia(6%) saturate(456%) hue-rotate(166deg) brightness(91%) contrast(89%);
}

.sidebar-footer {
    margin-top: auto;
    display: flex;
    flex-direction: column;
    gap: 12px;
    color: var(--mid-gray);
    font-size: 12px;
}

.sidebar-footer a,
.sidebar-footer .sidebar-footer-action {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--midnight-800);
    font-weight: 600;
    text-align: left;
    background: transparent;
    border: none;
    appearance: none;
    -webkit-appearance: none;
    text-align: left;
    width: 100%;
    font-family: inherit;
    font-size: inherit;
    text-decoration: none;
    cursor: pointer;
    padding: 0;
}

.sidebar-footer .sidebar-footer-action:focus-visible {
    outline: 2px solid var(--classic-blue);
    outline-offset: 2px;
}

.sidebar-footer strong {
    display: block;
    margin-top: 16px;
    padding: 14px 16px;
    border-radius: 6px;
    background: #9694f5;
    color: var(--pure-white);
    font-size: 16px;
    line-height: 1.45;
}

.collection-drawer-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1200;
    background: rgba(25, 25, 25, 0.38);
}

.collection-drawer {
    position: fixed;
    display: flex;
    flex-direction: column;
    width: 400px;
    max-width: calc(100vw - 32px);
    overflow-y: auto;
    background: var(--pure-white);
    box-shadow: 0 18px 42px rgba(12, 27, 84, 0.2);
}

.collection-drawer-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 56px;
    padding: 0 20px;
}

.collection-drawer-header h2 {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    color: var(--midnight-900);
    font-size: 20px;
    line-height: 28px;
}

.collection-drawer-header h2 span {
    width: 3px;
    height: 18px;
    background: var(--classic-blue);
}

.collection-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 44px;
    padding: 0 20px;
    border-bottom: 1px solid var(--pale-light-gray);
    color: var(--mid-gray);
    font-size: 12px;
}

.collection-summary div {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.collection-summary strong {
    color: var(--dark-gray);
    font-size: 14px;
}

.status-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    height: 20px;
    padding: 0 8px;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 800;
}

.status-pill.neutral {
    background: #eef2f7;
    color: var(--midnight-800);
}

.status-pill.success {
    border: 1px solid #0bae61;
    background: #ecfff5;
    color: #0bae61;
}

.status-pill.danger {
    border: 1px solid var(--deep-rose);
    background: #fff5f7;
    color: var(--deep-rose);
}

.collection-sync-table {
    width: calc(100% - 40px);
    margin: 24px 20px 36px;
    border-collapse: collapse;
    table-layout: fixed;
}

.collection-sync-table th,
.collection-sync-table td {
    height: 41px;
    border-bottom: 1px solid var(--pale-light-gray);
    padding: 6px;
    color: var(--deep-black);
    font-size: 13px;
    font-weight: 700;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.collection-sync-table thead th {
    height: 28px;
    border-bottom-color: var(--classic-blue);
    color: var(--classic-blue);
    font-size: 12px;
}

.collection-section {
    display: grid;
    gap: 12px;
    margin: 0 20px 40px;
}

.collection-section h3 {
    color: var(--deep-black);
    font-size: 16px;
    line-height: 22px;
}

.collection-section p {
    color: var(--mid-gray);
    font-size: 12px;
}

.collection-line-list {
    display: grid;
    border-top: 1px solid var(--classic-blue);
}

.collection-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(120px, 1fr);
    gap: 8px;
    align-items: center;
    min-height: 42px;
    border-bottom: 1px solid var(--pale-light-gray);
}

.collection-line.with-icon {
    grid-template-columns: 26px minmax(0, 1fr) auto minmax(112px, 1fr);
}

.collection-line strong,
.collection-line small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.collection-line strong {
    color: var(--deep-black);
    font-size: 13px;
    font-weight: 700;
}

.collection-line small {
    color: var(--gray);
    font-size: 12px;
}

.collection-refresh {
    min-height: 28px;
    margin-top: 6px;
}

.workspace {
    min-width: 0;
    padding: 32px;
}

.topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 32px;
}

.ledger-topbar {
    margin-bottom: 18px;
}

/* 점검 작업대 공용 상태 카드·필터 패널 */
.review-status-tabs {
    display: grid;
    grid-template-columns: repeat(8, minmax(82px, 1fr));
    align-items: stretch;
    gap: 5px;
    margin: 0 0 10px;
}

.review-status-tabs.four-up {
    grid-template-columns: repeat(4, minmax(120px, 1fr));
}

.review-status-tabs .status-tab {
    display: flex;
    min-height: 34px;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    padding: 6px 9px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 4px;
    background: var(--pure-white);
    color: var(--gray);
    cursor: pointer;
    font-family: var(--font-body);
    font-size: 11px;
    text-align: left;
}

.review-status-tabs .status-tab:hover,
.review-status-tabs .status-tab.active {
    border-color: var(--classic-blue);
    background: var(--classic-blue-25);
    color: var(--classic-blue);
}

.review-status-tabs .status-tab.active {
    box-shadow: inset 0 -2px var(--classic-blue);
}

.review-status-tabs .status-tab strong {
    color: var(--midnight-800);
    font-size: 12px;
}

.review-filter-panel {
    display: grid;
    gap: 12px;
    margin-bottom: 12px;
    padding: 10px 12px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 10px;
    background: var(--midnight-15);
}

.review-filter-panel.two-column {
    grid-template-columns: minmax(240px, .8fr) minmax(540px, 2fr);
    align-items: center;
}

.review-filter-panel.embedded {
    margin-bottom: 0;
    border: 0;
    border-bottom: 1px solid var(--pale-light-gray);
    border-radius: 10px 10px 0 0;
}

.review-filter-panel.flush {
    gap: 0;
    padding: 0;
}

.review-filter-controls {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 7px;
    min-width: 0;
}

.review-search-field {
    flex: 0 0 240px;
    width: 240px;
    max-width: 240px;
    min-width: 0;
}

.review-search-field .search-input-control {
    height: 28px;
    border-color: var(--pale-gray);
    border-radius: 4px;
    font-family: var(--font-body);
    font-size: 12px;
}

.review-search-field .search-icon {
    order: -1;
    color: #8b97a5;
}

.review-search-field .search-input-field::placeholder {
    color: #8b97a5;
    opacity: 1;
}

.review-selection-bar {
    position: sticky;
    z-index: 19;
    top: 8px;
    display: flex;
    overflow-x: auto;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
    padding: 8px 10px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 8px;
    background: var(--pure-white);
    box-shadow: var(--shadow-100);
    white-space: nowrap;
}

.review-selection-bar.active,
.review-selection-bar.unbalanced {
    border-color: var(--gold-200);
    background: var(--gold-25);
}

.review-selection-bar .basket-heading,
.review-selection-bar .basket-actions,
.review-selection-bar .basket-totals,
.review-selection-bar .basket-totals > div {
    display: flex;
    align-items: center;
}

.review-selection-bar .basket-heading {
    flex: 0 0 auto;
    gap: 7px;
}

.review-selection-bar .basket-heading span,
.review-selection-bar .basket-totals dt,
.review-compact-field > span {
    color: var(--gray);
    font-size: 10px;
}

.review-selection-bar .basket-icon {
    display: grid;
    width: 26px;
    height: 26px;
    place-items: center;
    color: var(--classic-blue);
}

.review-selection-bar .basket-heading > strong {
    color: var(--midnight-800);
    font-size: 13px;
    line-height: 1;
}

.review-selection-bar .basket-totals {
    flex: 0 0 auto;
    gap: 12px;
    margin: 0 0 0 auto;
}

.review-selection-bar .basket-totals > div {
    gap: 4px;
}

.review-selection-bar .basket-totals dd {
    margin: 0;
    color: var(--midnight-800);
    font-size: 11px;
    font-weight: 800;
}

.review-selection-bar .basket-actions {
    flex: 0 0 auto;
    gap: 7px;
}

.review-selection-bar .basket-actions button {
    white-space: nowrap;
}

.review-selection-bar .basket-validation {
    padding: 3px 6px;
    border-radius: 999px;
    background: var(--gold-50);
    color: var(--gold-700);
    font-size: 9px;
    font-style: normal;
    font-weight: 700;
}

.review-selection-bar .basket-validation.valid {
    background: var(--emerald-green-25);
    color: var(--emerald-green);
}

.review-compact-field {
    display: grid;
    grid-template-columns: auto minmax(88px, 1fr);
    align-items: center;
    gap: 5px;
}

.review-compact-field input,
.review-compact-field select {
    height: 28px;
    min-width: 0;
    border-color: var(--pale-gray);
    border-radius: 4px;
    font-family: var(--font-body);
    font-size: 12px;
}

.review-list-panel {
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--pale-light-gray);
    border-radius: 10px;
    background: var(--pure-white);
}

.review-list-toolbar {
    min-height: 45px;
    margin: 0 !important;
    padding: 8px 12px;
    border-bottom: 1px solid var(--pale-light-gray);
    background: #f7f9fb;
}

.review-list-panel .ledger-summary,
.review-list-panel .ledger-summary strong {
    color: var(--midnight-800);
    font-size: 12px;
}

.review-table-scroll {
    overflow: auto;
    max-height: 560px;
}

.review-data-table {
    width: 100%;
    border-collapse: collapse;
    color: var(--dark-gray);
    font-family: var(--font-body);
    font-size: 12px;
}

.review-data-table th {
    position: sticky;
    z-index: 2;
    top: 0;
    height: 32px;
    padding: 8px 7px;
    border-bottom: 1px solid var(--pale-light-gray);
    background: var(--pure-white);
    color: var(--gray);
    font-size: 10px;
    font-weight: 800;
    text-align: left;
    white-space: nowrap;
}

.review-data-table td {
    height: 44px;
    padding: 9px 7px;
    border-bottom: 1px solid var(--pale-light-gray);
    cursor: pointer;
    vertical-align: middle;
    white-space: nowrap;
}

.review-data-table tr:hover td {
    background: var(--classic-blue-25);
}

.review-data-table tr.selected-row td {
    background: var(--emerald-green-25);
}

.review-data-table .number,
.review-data-table .total-col {
    color: var(--midnight-800);
    font-weight: 800;
    text-align: right;
}

@media (max-width: 1100px) {
    .review-status-tabs {
        grid-template-columns: repeat(3, minmax(100px, 1fr));
    }

    .review-status-tabs.four-up {
        grid-template-columns: repeat(2, minmax(100px, 1fr));
    }

    .review-filter-panel.two-column {
        grid-template-columns: 1fr;
    }

    .review-selection-bar {
        position: static;
    }
}

@media (max-width: 620px) {
    .review-status-tabs,
    .review-status-tabs.four-up {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .review-search-field {
        flex-basis: 100%;
        width: 100%;
        max-width: none;
    }
}

.ledger-title-row {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 12px;
}

.ledger-title {
    font-family: var(--font-serif);
    position: relative;
    padding-left: 1rem;
    color: var(--midnight-800);
    font-size: 18px;
    line-height: 1;
    outline: 0;
}

.ledger-title::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 3px;
    border-radius: 2px;
    background: var(--midnight-600);
}

.ledger-title-meta {
    color: var(--gray);
    font-size: 13px;
    font-weight: 700;
    line-height: 18px;
}

.ledger-title-description {
    max-width: 720px;
    margin-top: 8px;
    color: var(--gray);
    font-size: 13px;
    line-height: 20px;
}

.title-action {
    border-color: var(--pale-gray);
    background: var(--pure-white);
    color: var(--midnight-800);
}

.sr-only {
    position: absolute;
    overflow: hidden;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

.eyebrow {
    margin: 0 0 6px;
    color: var(--midnight-600);
    font-size: 10px;
    font-weight: 700;
    line-height: 10px;
    text-transform: uppercase;
}

h1,
h2,
h3,
p {
    margin: 0;
}

h1 {
    color: var(--midnight-900);
    font-size: 24px;
    line-height: 32px;
}

h1:focus {
    outline: 0;
}

h2 {
    color: var(--midnight-900);
    font-size: 16px;
    line-height: 16px;
}

h3 {
    color: var(--deep-black);
    font-size: 16px;
    line-height: 24px;
}

.topbar-actions,
.filter-group {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    min-width: 0;
}

.ledger-header-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.sidebar-toggle {
    border-color: var(--pale-gray);
    background: var(--pure-white);
}

.view-mode-switch {
    display: inline-grid;
    grid-template-columns: repeat(3, minmax(86px, 1fr));
    height: 36px;
    border: 1px solid var(--midnight-800);
    border-radius: 2px;
    overflow: hidden;
}

.view-mode-switch button {
    border: 0;
    border-right: 1px solid var(--midnight-100);
    background: var(--pure-white);
    color: var(--midnight-800);
    cursor: pointer;
    padding: 0 12px;
    font-size: 13px;
    font-weight: 700;
    white-space: nowrap;
}

.view-mode-switch button:last-child {
    border-right: 0;
}

.view-mode-switch button.active {
    background: var(--midnight-800);
    color: var(--pure-white);
}

.select {
    min-width: 184px;
}

.notification {
    position: relative;
    color: var(--deep-rose);
}

.metric-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 24px;
    margin-bottom: 24px;
}

.metric-card,
.panel {
    min-width: 0;
    border: 1px solid var(--pale-light-gray);
    border-radius: 8px;
    background: var(--pure-white);
    box-shadow: var(--shadow-100);
}

.metric-card {
    min-height: 132px;
    padding: 24px;
}

.workspace-overview-metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.card-title,
.panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.card-title {
    justify-content: flex-start;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--pale-light-gray);
    color: var(--midnight-800);
    font-weight: 700;
}

.card-title > button,
.card-title > a,
.card-title > [class^="btn-"],
.card-title > [class*=" btn-"] {
    flex: 0 0 auto;
    margin-left: auto;
}

.workspace-overview-period-title {
    width: 100%;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
}

.workspace-overview-period-subtitle {
    margin-left: auto;
    color: var(--gray);
    font-size: 11px;
    font-weight: 400;
    opacity: 0.85;
}

.metric-amount {
    margin-top: 14px;
    color: var(--classic-blue);
    font-size: 24px;
    font-weight: 700;
    line-height: 32px;
}

.metric-amount span {
    font-size: 14px;
    font-weight: 400;
}

.metric-card small {
    color: var(--gray);
    font-size: 11px;
}

.workspace-create-modal {
    width: min(540px, 100%);
}

.manual-ledger-modal-backdrop {
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.manual-ledger-create-modal {
    max-height: calc(100vh - 48px);
    margin: 0;
    overflow-y: auto;
}

.workspace-create-modal .modal-body.workspace-create-form {
    gap: 12px;
}

.workspace-create-modal .workspace-create-modal-help {
    margin: 0;
    color: var(--dark-gray);
    font-size: 12px;
}

.workspace-create-modal .workspace-create-status {
    display: block;
    margin: 0;
    color: var(--gray);
    font-size: 12px;
}

.workspace-create-modal .workspace-create-status:empty {
    display: none;
}

.workspace-overview-kpis {
    margin-top: 14px;
    display: grid;
    gap: 10px;
}

.workspace-overview-kpis span {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    color: var(--midnight-900);
    font-size: 13px;
}

.workspace-overview-kpis span strong {
    font-size: 14px;
    color: var(--midnight-900);
}

.metric-card.expense .metric-amount {
    color: var(--deep-rose);
}

.section-grid {
    display: grid;
    gap: 24px;
    margin-bottom: 24px;
}

.section-grid.two {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.panel {
    margin-bottom: 24px;
    padding: 24px;
}

.ledger-panel {
    background: var(--pure-white);
}

.ledger-intro-panel {
    margin-bottom: 24px;
}

.ledger-settings-view,
.ledger-monthly-view {
    display: grid;
    gap: 24px;
}

.ledger-monthly-view {
    gap: 36px;
}

.ledger-form-overview {
    display: grid;
    gap: 16px;
    padding: 20px;
    border-bottom: 1px solid var(--pale-light-gray);
    background: #f8fafe;
}

.classification-tabs.ledger-view-tabs {
    gap: 6px;
    padding: 14px 20px;
    border-bottom: 1px solid var(--pale-light-gray);
    background: var(--pure-white);
}

.classification-tabs.ledger-view-tabs button {
    min-width: 132px;
    justify-content: center;
}

.card-management-tabs .card-tab-year-filter {
    display: flex;
    align-items: center;
    gap: 8px;
    justify-content: flex-end;
    flex: 0 0 auto;
    margin-left: auto;
    padding-left: 16px;
    white-space: nowrap;
}

.card-management-tabs .card-tab-year-filter > span {
    color: var(--gray);
    font-size: 12px;
}

.card-management-tabs .card-tab-year-filter .select-small {
    width: 102px;
    min-width: 102px;
}

.ledger-view-button-group {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    padding: 16px 20px;
    border-bottom: 1px solid var(--pale-light-gray);
    background: var(--pure-white);
}

.ledger-view-button-group button {
    min-width: 142px;
    justify-content: center;
}

.ledger-transaction-view {
    min-width: 0;
}

.cash-flow-account-filter select {
    min-width: 190px;
}

.card-holder-history-panel {
    display: grid;
    gap: 14px;
    margin: 0 20px 18px;
    padding: 18px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 6px;
    background: #f8fafe;
}

.card-holder-history-head,
.card-holder-history-copy,
.card-holder-history-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.card-holder-history-copy {
    align-items: flex-start;
    flex-direction: column;
    gap: 3px;
}

.card-holder-history-copy > strong {
    color: var(--midnight-900);
    font-family: var(--font-serif);
    font-size: 18px;
    line-height: 1.3;
}

.card-holder-history-actions {
    flex: 0 0 auto;
}

.card-holder-history-actions .btn-outline {
    white-space: nowrap;
}

.card-holder-history-actions .btn-outline > span {
    color: inherit;
    font-size: inherit;
}

.card-holder-history-head span,
.card-holder-form label > span,
.card-holder-history-list span,
.card-holder-history-list small {
    color: var(--gray);
    font-size: 12px;
}

.card-holder-form {
    display: grid;
    grid-template-columns: minmax(170px, 1.2fr) minmax(150px, .8fr) 140px 140px minmax(180px, 1.4fr) auto;
    align-items: end;
    gap: 10px;
}

.card-holder-form label {
    display: grid;
    gap: 5px;
}

.card-holder-status {
    color: var(--classic-blue);
    font-size: 12px;
}

.card-holder-history-list {
    display: grid;
    gap: 6px;
}

.card-holder-history-list article {
    display: grid;
    grid-template-columns: minmax(140px, .8fr) minmax(190px, 1fr) minmax(180px, 1.4fr);
    gap: 12px;
    padding: 10px 12px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 4px;
    background: var(--pure-white);
}

.card-user-account-groups {
    display: grid;
    gap: 12px;
}

.card-user-account-groups > section {
    display: grid;
    gap: 8px;
}

.card-user-account-groups header {
    display: flex;
    justify-content: space-between;
    color: var(--midnight-900);
    font-size: 14px;
    gap: 10px;
}

.card-user-account-groups .workspace-list {
    display: grid;
    gap: 8px;
}

.card-user-account-groups .card-account-list-item {
    background: var(--pure-white);
    appearance: none;
    border: 0;
    border-bottom: 1px solid var(--pale-light-gray);
    border-radius: 0;
    width: 100%;
    padding: 12px 0;
    color: var(--midnight-900);
    cursor: pointer;
    text-align: left;
}

.card-user-account-groups .card-account-list-item:hover,
.card-user-account-groups .card-account-list-item:focus-visible {
    border-color: var(--classic-blue);
    background: rgba(32, 128, 141, .04);
    outline: 0;
}

.card-account-list-item .workspace-stats {
    gap: 10px;
    align-items: center;
}

.card-user-account-groups .card-unassigned-shortcut {
    appearance: none;
    width: 100%;
    border: 0;
    border-bottom: 1px solid var(--pale-light-gray);
    background: var(--pure-white);
    color: var(--midnight-900);
    cursor: pointer;
    text-align: left;
}

.card-user-account-groups .card-unassigned-shortcut:hover,
.card-user-account-groups .card-unassigned-shortcut:focus-visible {
    border-bottom-color: var(--classic-blue);
    background: rgba(32, 128, 141, .04);
    outline: 0;
}

.ledger-form-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
}

.ledger-form-heading > div {
    display: grid;
    gap: 4px;
}

.ledger-form-heading strong {
    color: var(--midnight-900);
    font-size: 16px;
}

.ledger-form-heading span,
.ledger-form-metrics span {
    color: var(--gray);
    font-size: 12px;
}

.ledger-form-metrics {
    display: grid;
    grid-template-columns: repeat(5, minmax(140px, 1fr));
    gap: 10px;
}

.ledger-form-metrics article {
    display: grid;
    gap: 6px;
    padding: 14px 16px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 6px;
    background: var(--pure-white);
}

.ledger-form-metrics strong {
    color: var(--midnight-900);
    font-size: 15px;
}

.card-form-metrics {
    grid-template-columns: repeat(4, minmax(140px, 1fr));
}

.card-common-metrics {
    grid-template-columns: repeat(3, minmax(160px, 1fr));
}

.card-attention-metrics {
    grid-template-columns: minmax(220px, 1fr);
}


.card-scroll-hint {
    display: none;
    color: var(--gray);
    font-size: 11px;
    text-align: right;
}

.card-summary-row {
    cursor: pointer;
}

.card-summary-row:hover > * {
    background: #f2f6fd;
}

.card-summary-matrix th:first-child {
    min-width: 170px;
}

.card-summary-matrix th:nth-child(2) {
    min-width: 145px;
}

.card-primary-cell,
.card-assignee-cell {
    display: grid;
    gap: 4px;
    justify-items: start;
}

.card-assignment-open {
    min-height: 24px;
    margin-top: 2px;
    padding: 2px 7px;
    background: var(--pure-white);
    font-size: 11px;
    line-height: 16px;
    white-space: nowrap;
}

.card-assignment-modal-backdrop {
    align-items: flex-start;
    overflow-y: auto;
}

.figma-modal.card-assignment-modal {
    gap: 20px;
    width: min(980px, calc(100vw - 48px));
    min-width: 0;
    max-height: calc(100vh - 48px);
    margin: auto;
    padding: 24px 32px;
    overflow: hidden;
}

.card-assignment-modal > * {
    min-width: 0;
}

.card-assignment-modal > .modal-header .modal-description {
    display: block;
    color: var(--gray);
    font-size: 12px;
}

.card-assignment-modal-body {
    overflow-x: hidden;
    overflow-y: auto;
}

.card-assignment-modal .card-holder-history-panel {
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.card-assignment-modal .card-holder-form {
    grid-template-columns: minmax(180px, 1.3fr) repeat(3, minmax(130px, 1fr));
}

.card-assignment-modal .card-holder-form label,
.card-assignment-modal .card-holder-form input,
.card-assignment-modal .card-holder-form select {
    min-width: 0;
    width: 100%;
}

.card-assignment-modal .card-holder-memo-field {
    grid-column: 1 / 4;
}

.card-assignment-modal .card-holder-form .btn-primary {
    min-width: 132px;
    justify-self: end;
    white-space: nowrap;
}

@media (max-width: 760px) {
    .card-assignment-modal-backdrop {
        padding: 12px;
    }

    .figma-modal.card-assignment-modal {
        width: calc(100vw - 24px);
        max-height: calc(100vh - 24px);
        padding: 20px;
    }

    .card-holder-history-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .card-holder-history-actions {
        width: 100%;
        justify-content: space-between;
    }

    .card-assignment-modal .card-holder-form {
        grid-template-columns: 1fr;
    }

    .card-assignment-modal .card-holder-memo-field {
        grid-column: auto;
    }

    .card-assignment-modal .card-holder-form .btn-primary {
        width: 100%;
    }
}

.card-matrix-primary,
.card-transaction-primary,
.card-transaction-secondary {
    display: block;
}

.card-summary-matrix th small,
.card-transaction-secondary {
    margin-top: 3px;
    color: var(--gray);
    font-size: 11px;
    font-weight: 400;
}

.card-unassigned-label {
    color: #a45016;
    font-weight: 700;
}

.badge.warning {
    background: #fff0df;
    color: #93450f;
}

.ledger-table .card-transaction-primary {
    min-width: 130px;
}

.ledger-form-table-wrap {
    border: 1px solid var(--pale-light-gray);
    border-radius: 6px;
    background: var(--pure-white);
}

.ledger-form-table {
    min-width: 900px;
}

.card-user-matrix-table {
    min-width: 1300px;
}

.cash-flow-matrix-table tbody tr:nth-child(4n) > * {
    border-bottom: 2px solid #ccd5e5;
}

.cash-flow-balance-row {
    background: #f4f7fc;
    font-weight: 700;
}

.cash-flow-account-heading {
    min-width: 116px;
}

.cash-flow-account-heading button {
    position: relative;
    width: 100%;
    padding: 5px 8px;
    border: 1px solid transparent;
    border-radius: 4px;
    overflow: visible;
    background: transparent;
    color: inherit;
    cursor: pointer;
    font: inherit;
    white-space: nowrap;
}

.cash-flow-account-heading button:hover,
.cash-flow-account-heading button.selected {
    border-color: var(--classic-blue);
    background: var(--classic-blue-25);
    color: var(--classic-blue);
}

.cash-flow-account-heading button:hover::after,
.cash-flow-account-heading button:focus-visible::after {
    position: absolute;
    z-index: 20;
    top: calc(100% + 7px);
    left: 50%;
    min-width: max-content;
    max-width: 280px;
    padding: 7px 9px;
    border-radius: 4px;
    background: var(--midnight-900);
    color: var(--pure-white);
    box-shadow: var(--shadow-100);
    content: attr(data-full-name);
    font-size: 12px;
    font-weight: 500;
    line-height: 16px;
    text-align: left;
    transform: translateX(-50%);
    white-space: normal;
}

.cash-flow-account-summary-card {
    display: grid;
    grid-template-columns: minmax(220px, .8fr) minmax(520px, 2fr);
    align-items: center;
    gap: 20px;
    padding: 16px 18px;
    border: 1px solid var(--classic-blue);
    border-radius: 6px;
    background: var(--pure-white);
    box-shadow: var(--shadow-100);
}

.cash-flow-account-summary-card > div,
.cash-flow-account-summary-card > div > span {
    display: flex;
    min-width: 0;
}

.cash-flow-account-summary-card > div {
    align-items: center;
    gap: 12px;
}

.cash-flow-account-summary-card > div > span {
    align-items: flex-start;
    flex-direction: column;
    gap: 2px;
}

.cash-flow-account-summary-card small,
.cash-flow-account-summary-card em,
.cash-flow-account-summary-card dt {
    color: var(--gray);
    font-size: 11px;
    font-style: normal;
}

.cash-flow-account-summary-card dl {
    display: grid;
    grid-template-columns: repeat(4, minmax(110px, 1fr));
    gap: 12px;
    margin: 0;
}

.cash-flow-account-summary-card dl > div {
    display: grid;
    gap: 4px;
}

.cash-flow-account-summary-card dd {
    margin: 0;
    color: var(--midnight-900);
    font-size: 13px;
    font-weight: 700;
}

.ledger-settings-grid {
    display: grid;
    grid-template-columns: minmax(260px, 1.4fr) repeat(3, minmax(180px, 1fr));
    gap: 16px;
}

.ledger-setting-card,
.ledger-config-panel,
.monthly-summary-grid article {
    border: 1px solid var(--pale-light-gray);
    border-radius: 6px;
    background: var(--pure-white);
    box-shadow: var(--shadow-100);
}

.ledger-setting-card {
    display: flex;
    min-height: 112px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 20px;
}

.ledger-setting-card:not(.primary) {
    align-items: flex-start;
    flex-direction: column;
}

.ledger-setting-card strong {
    color: var(--midnight-900);
    font-size: 22px;
    line-height: 30px;
}

.setting-kicker {
    display: block;
    margin-bottom: 8px;
    color: var(--mid-gray);
    font-size: 12px;
    font-weight: 700;
}

.ledger-setting-layout {
    display: grid;
    grid-template-columns: minmax(360px, 0.9fr) minmax(420px, 1.1fr);
    gap: 24px;
    align-items: start;
}

.ledger-config-panel {
    min-height: 360px;
    padding: 22px;
}

.ledger-config-panel header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 18px;
}

.ledger-book-list,
.ledger-account-stack {
    display: grid;
    gap: 10px;
}

.ledger-book-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    width: 100%;
    min-height: 72px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 4px;
    background: var(--pure-white);
    color: var(--deep-black);
    padding: 14px 16px;
}

.ledger-book-row.active {
    border-color: var(--classic-blue);
    background: #f7f9ff;
}

.ledger-book-main {
    display: grid;
    gap: 4px;
    min-width: 0;
    border: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
    padding: 0;
    text-align: left;
}

.ledger-book-main span {
    font-weight: 700;
}

.ledger-book-main small {
    color: var(--gray);
}

.ledger-book-actions {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.ledger-book-actions .icon-button {
    color: var(--midnight-800);
}

.icon-button.danger {
    color: var(--deep-rose);
}

.ledger-account-row {
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr) 32px;
    gap: 12px;
    align-items: center;
    min-height: 64px;
    border-bottom: 1px solid var(--pale-light-gray);
}

.ledger-account-row:last-child {
    border-bottom: 0;
}

.ledger-account-row strong,
.ledger-account-row span {
    display: block;
}

.ledger-account-row span {
    margin-top: 3px;
    color: var(--gray);
    font-size: 12px;
}

.source-ledger-overview {
    display: grid;
    gap: 14px;
    margin-bottom: 18px;
}

.source-ledger-panel {
    overflow: hidden;
}

.source-ledger-stage {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 18px;
    align-items: start;
}

.source-ledger-stage.is-detail-open {
    grid-template-columns: minmax(0, 1fr);
}

.source-ledger-list-pane,
.source-ledger-detail-pane {
    min-width: 0;
}

.source-ledger-list-pane {
    display: grid;
    gap: 14px;
    animation: source-ledger-list-enter 180ms ease;
}

.source-ledger-detail-pane {
    display: grid;
    gap: 14px;
    animation: source-ledger-detail-enter 220ms ease;
}

.source-ledger-stage.is-detail-open .source-ledger-detail-pane {
    border-left: 0;
    padding-left: 0;
}

@keyframes source-ledger-list-enter {
    from {
        opacity: 0;
        transform: scale(.985);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes source-ledger-detail-enter {
    from {
        opacity: 0;
        transform: translateY(8px) scale(.99);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.source-ledger-head,
.source-ledger-card-head,
.source-ledger-card-foot,
.source-ledger-detail-strip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.source-ledger-head strong {
    display: block;
    color: var(--midnight-900);
    font-size: 16px;
    line-height: 22px;
}

.source-ledger-head span {
    display: block;
    margin-top: 2px;
    color: var(--gray);
    font-size: 13px;
}

.source-ledger-head.source-ledger-list-head {
    align-items: center;
    flex-flow: row nowrap;
}

.source-ledger-list-head > :last-child {
    flex: 0 0 auto;
    margin-left: auto;
}

.source-ledger-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.source-ledger-metrics article {
    display: grid;
    gap: 4px;
    min-height: 74px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 6px;
    background: #fbfcff;
    padding: 14px 16px;
}

.source-ledger-metrics span,
.source-ledger-card span,
.source-ledger-detail-strip span,
.source-ledger-detail-strip small,
.source-ledger-detail-strip dt {
    color: var(--gray);
    font-size: 12px;
}

.source-ledger-metrics strong {
    color: var(--midnight-900);
    font-size: 20px;
    line-height: 26px;
}

.source-ledger-group-list {
    display: grid;
    gap: 16px;
}

.source-ledger-group {
    display: grid;
    gap: 8px;
    padding-top: 2px;
    border-top: 1px solid var(--pale-light-gray);
}

.source-ledger-group header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 28px;
}

.source-ledger-group header strong {
    color: var(--midnight-900);
    font-size: 13px;
}

.source-ledger-group header span {
    color: var(--gray);
    font-size: 12px;
}

.source-ledger-row-list {
    display: grid;
    gap: 6px;
}

.source-ledger-row-shell {
    position: relative;
}

.source-ledger-row {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) minmax(280px, auto);
    gap: 12px;
    align-items: center;
    width: 100%;
    min-height: 58px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 6px;
    background: var(--pure-white);
    color: var(--midnight-900);
    cursor: pointer;
    padding: 9px 12px;
    text-align: left;
    transition: border-color 160ms ease, background 160ms ease, transform 160ms ease;
}

.source-ledger-row:hover,
.source-ledger-row.active {
    border-color: var(--classic-blue);
    background: #f7f9ff;
}

.source-ledger-row:hover {
    box-shadow: inset 0 0 0 1px var(--classic-blue);
}

.source-ledger-edit-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 50%;
    right: 8px;
    z-index: 1;
    width: 32px;
    height: 32px;
    min-height: 32px;
    padding: 0;
    border: 0;
    border-radius: 5px;
    color: var(--gray);
    background: transparent;
    transform: translateY(-50%);
}

.source-ledger-edit-button:hover {
    color: var(--midnight-900);
    background: #eef2f5;
}

.source-ledger-row-shell .source-ledger-row {
    padding-right: 48px;
}

.source-ledger-edit-original,
.source-ledger-edit-original strong,
.source-ledger-edit-original small {
    display: block;
}

.source-ledger-edit-original {
    padding: 12px 14px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 6px;
    background: #f8faff;
}

.source-ledger-edit-original span,
.source-ledger-edit-original small {
    color: var(--gray);
    font-size: 12px;
}

.source-ledger-edit-original strong {
    margin: 4px 0;
    overflow: hidden;
    color: var(--midnight-900);
    font-size: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.source-ledger-edit-modal {
    width: min(480px, 100%);
}

.source-ledger-description {
    box-sizing: border-box;
    height: auto;
    min-height: 84px;
    padding: 8px 10px;
    font-family: inherit;
    font-size: 14px;
    font-weight: 400;
    line-height: 21px;
    letter-spacing: 0;
    resize: vertical;
}

.source-ledger-row-main {
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    min-width: 0;
}

.source-ledger-row-main strong,
.source-ledger-row-main small {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.source-ledger-row-main strong {
    color: var(--midnight-900);
    font-size: 14px;
}

.source-ledger-row-main small,
.source-ledger-row-meta span {
    color: var(--gray);
    font-size: 12px;
}

.source-ledger-row-meta {
    display: grid;
    grid-template-columns: repeat(4, max-content);
    gap: 12px;
    align-items: center;
    justify-content: end;
    min-width: 0;
}

.source-ledger-detail-head {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.source-ledger-detail-head-top {
    margin-top: 20px;
    margin-bottom: 20px;
}

.ledger-title-original {
    color: var(--midnight-600);
    font-size: 0.8rem;
    font-weight: 400;
}

.ledger-table tr.duplicate-group-even td {
    background: #fff8e8;
}

.ledger-table tr.duplicate-group-odd td {
    background: #eef6ff;
}

.source-ledger-summary-badges,
.ledger-summary-badges {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.source-ledger-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 10px;
}

.source-ledger-card {
    display: grid;
    gap: 8px;
    min-height: 132px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 6px;
    background: var(--pure-white);
    color: var(--midnight-900);
    cursor: pointer;
    padding: 14px;
    text-align: left;
}

.source-ledger-card:hover,
.source-ledger-card.active {
    border-color: var(--classic-blue);
    background: #f7f9ff;
}

.source-ledger-card strong {
    overflow: hidden;
    color: var(--midnight-900);
    font-size: 15px;
    line-height: 20px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.source-ledger-card > span:not(.source-ledger-card-head):not(.source-ledger-card-foot) {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.source-ledger-status {
    color: var(--mid-gray);
    font-weight: 700;
}

.source-ledger-card-foot {
    align-items: flex-end;
    padding-top: 4px;
}

.source-ledger-card-foot span {
    display: inline-flex;
    min-width: 0;
    white-space: nowrap;
}

.source-ledger-work.warning {
    color: var(--deep-rose);
    font-weight: 800;
}

.source-ledger-detail-strip {
    margin-bottom: 16px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 6px;
    background: #f8fafc;
    padding: 14px 16px;
}

.source-ledger-detail-strip > div:first-child {
    display: grid;
    gap: 3px;
    min-width: 220px;
}

.source-ledger-detail-strip strong {
    color: var(--midnight-900);
    font-size: 16px;
    line-height: 21px;
}

.source-ledger-detail-strip dl {
    display: grid;
    grid-template-columns: repeat(5, minmax(76px, 1fr));
    gap: 12px;
    margin: 0;
}

.source-ledger-detail-strip dl div {
    display: grid;
    gap: 2px;
}

.source-ledger-detail-strip dd {
    margin: 0;
    color: var(--midnight-900);
    font-size: 13px;
    font-weight: 800;
}

.amount-filter-field .input-small {
    width: 118px;
}

.ledger-advanced-filters {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 12px;
    margin: -4px 0 8px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 6px;
    background: #fbfcff;
    padding: 12px;
}

.supplementary-ledger-panel {
    display: grid;
    gap: 14px;
    margin-bottom: 18px;
    padding-top: 18px;
}

.supplementary-metric-grid {
    margin-top: 4px;
}

.supplementary-agency-metric-grid {
    margin: 4px 0 10px;
}

.classification-tabs.ledger-view-tabs.supplementary-ledger-tabs {
    margin-top: 2px;
}

.supplementary-ledger-tabs button .badge {
    min-width: 24px;
    justify-content: center;
}

.supplementary-confirmed-layout {
    display: grid;
    grid-template-columns: minmax(280px, 320px) minmax(0, 1fr);
    gap: 12px;
    align-items: start;
}

.supplementary-book-list-panel {
    display: grid;
    gap: 8px;
    min-height: 0;
    padding: 16px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 8px;
    background: var(--pure-white);
}

.supplementary-book-list-panel-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.supplementary-book-list-panel strong {
    align-items: center;
    display: inline-flex;
    font-size: 16px;
    gap: 8px;
}

.supplementary-book-list-panel-header .badge {
    background: #dce7f5;
    color: var(--classic-blue);
    min-width: 34px;
}

.supplementary-book-list-toolbar {
    align-items: end;
    display: grid;
    gap: 8px;
    grid-template-columns: minmax(0, 1fr) auto;
}

.supplementary-book-search,
.supplementary-book-search input {
    margin: 0;
    width: 100%;
}

.supplementary-book-sort-field {
    align-items: center;
    display: flex;
    gap: 6px;
    margin: 0;
    white-space: nowrap;
}

.supplementary-book-sort-field > span {
    font-size: 12px;
    font-weight: 600;
}

.supplementary-book-sort-field .select-small {
    min-width: 72px;
    width: 72px;
}

.supplementary-book-list {
    display: grid;
    gap: 8px;
    max-height: 650px;
    min-width: 0;
    overflow: auto;
}

.supplementary-book-list .supplementary-book-list-item {
    background: var(--pure-white);
    border: 1px solid var(--pale-gray);
    border-radius: 10px;
    color: inherit;
    cursor: pointer;
    display: grid;
    gap: 7px;
    min-height: 84px;
    padding: 12px;
    text-align: left;
    width: 100%;
}

.supplementary-book-list .supplementary-book-list-item:hover,
.supplementary-book-list .supplementary-book-list-item.active {
    border-color: var(--classic-blue);
    background: var(--classic-blue-25);
}

.supplementary-book-name,
.supplementary-book-balances {
    align-items: center;
    display: flex;
    justify-content: space-between;
    min-width: 0;
}

.supplementary-book-name strong {
    color: var(--midnight-800);
    display: block;
    font-size: 14px;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.supplementary-book-name em {
    background: #fff1f2;
    border-radius: 999px;
    color: #be123c;
    flex: 0 0 auto;
    font-size: 11px;
    font-style: normal;
    padding: 3px 7px;
}

.supplementary-book-balances {
    color: var(--gray);
    font-size: 11px;
    gap: 8px;
}

.supplementary-book-empty {
    color: var(--gray);
    font-size: 12px;
    padding: 24px 8px;
    text-align: center;
}

.supplementary-confirmed-table-area {
    min-width: 0;
}

.supplementary-confirmed-table-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 39px;
    padding: 0 2px 8px;
    color: var(--midnight-800);
    font-size: 13px;
}

.supplementary-confirmed-table-title {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.supplementary-confirmed-table-title strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.supplementary-confirmed-table-title .badge {
    flex: 0 0 auto;
}

.supplementary-confirmed-summary {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 18px;
    margin: 0;
}

.supplementary-confirmed-summary > div {
    display: flex;
    align-items: baseline;
    gap: 6px;
    white-space: nowrap;
}

.supplementary-confirmed-summary dt {
    color: var(--gray);
    font-size: 11px;
}

.supplementary-confirmed-summary dd {
    margin: 0;
    color: var(--midnight-900);
    font-size: 12px;
    font-weight: 700;
}

.supplementary-draft-review-modal {
    width: min(720px, calc(100vw - 32px));
    max-height: calc(100vh - 48px);
    overflow: auto;
    gap: 16px;
    padding: 24px 28px 20px;
}

.supplementary-draft-review-modal > .modal-header {
    align-items: flex-start;
}

.supplementary-draft-review-modal > .modal-header h2 {
    margin: 0 0 2px;
    color: var(--deep-black);
    font-size: 20px;
    line-height: 28px;
}

.supplementary-draft-review-modal .supplementary-editor-meta {
    color: var(--gray);
    font-size: 13px;
    line-height: 20px;
}

.supplementary-draft-review-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.supplementary-draft-review-summary > div {
    display: grid;
    gap: 4px;
    min-width: 0;
    padding: 12px 14px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 8px;
    background: var(--pure-white);
}

.supplementary-draft-review-summary span {
    color: var(--gray);
    font-size: 12px;
}

.supplementary-draft-review-summary strong {
    margin: 0;
    color: var(--midnight-900);
    font-size: 14px;
    line-height: 20px;
    overflow-wrap: anywhere;
}

.supplementary-draft-source-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    margin: 0;
}

.supplementary-draft-source-grid > div {
    display: grid;
    gap: 3px;
    min-width: 0;
    padding: 10px 12px;
    border-radius: 6px;
    background: var(--midnight-15);
}

.supplementary-draft-source-grid > div.wide {
    grid-column: span 2;
}

.supplementary-draft-source-grid dt {
    color: var(--gray);
    font-size: 11px;
}

.supplementary-draft-source-grid dd {
    margin: 0;
    color: var(--midnight-900);
    font-size: 13px;
    line-height: 18px;
    overflow-wrap: anywhere;
}

.supplementary-draft-edit-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.supplementary-draft-edit-grid .field {
    min-width: 0;
}

.supplementary-draft-edit-grid .input-small {
    width: 100%;
}

.supplementary-draft-edit-grid small {
    color: var(--gray);
    font-size: 11px;
}

.supplementary-draft-reason-field {
    gap: 8px;
}

.supplementary-draft-reason-field > span {
    color: var(--midnight-900);
    font-size: 13px;
    font-weight: 600;
    line-height: 18px;
}

.supplementary-draft-review-modal .field.field-medium .supplementary-draft-reason-input {
    box-sizing: border-box;
    width: 100%;
    height: auto;
    min-height: 104px;
    max-height: 220px;
    border-radius: 2px;
}

.supplementary-draft-review-modal .field.field-medium .supplementary-draft-reason-input::placeholder {
    color: var(--mid-gray);
    font-size: 13px;
    line-height: 21px;
}

.supplementary-draft-reason-field small {
    color: var(--gray);
    font-size: 12px;
    line-height: 18px;
}

.supplementary-draft-exclude-note {
    margin: -6px 0 0;
    color: var(--gray);
    font-size: 12px;
    line-height: 18px;
}

.supplementary-draft-review-footer .danger {
    margin-right: auto;
}

.supplementary-draft-review-modal > .supplementary-draft-review-footer {
    position: sticky;
    z-index: 2;
    bottom: -20px;
    gap: 8px;
    margin: 0 -28px -20px;
    padding: 14px 28px 20px;
    border-top: 1px solid var(--pale-light-gray);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.94), var(--paper-white) 30%);
}

.supplementary-draft-validation {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 14px;
    border: 1px solid #b8dfcb;
    border-radius: 8px;
    background: #effaf4;
    color: #17663d;
}

.supplementary-draft-validation.invalid {
    border-color: #f0c6c3;
    background: #fff4f3;
    color: #a13a34;
}

.supplementary-draft-validation > div {
    display: grid;
    gap: 2px;
}

.supplementary-draft-validation strong,
.supplementary-draft-validation span {
    font-size: 13px;
    line-height: 18px;
}

.supplementary-draft-validation span {
    opacity: 0.82;
}

@media (max-width: 720px) {
    .supplementary-confirmed-layout {
        grid-template-columns: 1fr;
    }

    .supplementary-confirmed-table-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .supplementary-confirmed-summary {
        width: 100%;
        justify-content: flex-start;
        flex-wrap: wrap;
    }

    .supplementary-draft-review-summary,
    .supplementary-draft-edit-grid,
    .supplementary-draft-source-grid {
        grid-template-columns: 1fr 1fr;
    }

    .supplementary-draft-source-grid > div.wide {
        grid-column: span 2;
    }

    .supplementary-draft-review-footer {
        flex-wrap: wrap;
    }

    .supplementary-draft-review-footer .danger {
        width: 100%;
        margin-right: 0;
    }
}

.supplementary-toast {
    position: fixed;
    z-index: 1500;
    top: 24px;
    right: 24px;
    max-width: min(520px, calc(100vw - 48px));
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    border: 1px solid #b8dfcb;
    border-radius: 8px;
    background: #effaf4;
    box-shadow: 0 10px 30px rgba(15, 35, 67, 0.18);
    color: #17663d;
    font-size: 13px;
    line-height: 18px;
}

.supplementary-toast span {
    min-width: 0;
    flex: 1;
}

.supplementary-toast .icon-button {
    width: 28px;
    min-width: 28px;
    height: 28px;
}

.supplementary-subhead {
    align-items: flex-start;
    margin-top: 4px;
}

.classification-lock-reason {
    min-width: 10rem;
}

.classification-rule-preview {
    display: grid;
    gap: 0.75rem;
    margin: 0.75rem 0 1rem;
}

.supplementary-ledger-message {
    border: 1px solid var(--pale-light-gray);
    border-radius: 6px;
    background: #fbfcff;
    color: var(--gray);
    font-size: 13px;
    line-height: 18px;
    padding: 10px 12px;
}

.supplementary-ledger-table th,
.supplementary-ledger-table td {
    white-space: nowrap;
}

.supplementary-ledger-table:not(.public-agency-ledger-table) td:nth-child(3) {
    min-width: 180px;
    white-space: normal;
}

.supplementary-ledger-table .confirmed-row {
    color: var(--muted);
}

.supplementary-ledger-table .confirmed-row.selected-row {
    color: inherit;
}

.supplementary-type-badge {
    min-height: 22px;
    padding: 3px 8px;
    font-size: 11px;
    line-height: 14px;
}

.supplementary-status-badge {
    min-width: 44px;
    justify-content: center;
}

.supplementary-status-badge.draft {
    border-color: rgba(183, 112, 12, .22);
    background: rgba(183, 112, 12, .09);
    color: #7a4a08;
}

.supplementary-status-badge.confirmed {
    border-color: rgba(32, 128, 141, .22);
    background: rgba(32, 128, 141, .1);
    color: var(--classic-blue);
}

.public-agency-ledger-table td:nth-child(3) {
    min-width: 96px;
}

.view-criteria-strip {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 14px;
}

.view-criteria-strip span {
    border: 1px solid var(--pale-light-gray);
    border-radius: 999px;
    background: #fbfcff;
    color: var(--gray);
    font-size: 12px;
    line-height: 16px;
    padding: 6px 10px;
}

.monthly-summary-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.monthly-summary-grid article {
    display: grid;
    gap: 8px;
    min-height: 104px;
    padding: 20px;
}

.monthly-summary-grid span {
    color: var(--gray);
    font-size: 12px;
    font-weight: 700;
}

.monthly-summary-grid strong {
    color: var(--midnight-900);
    font-size: 22px;
    line-height: 30px;
}

.monthly-table {
    min-width: 880px;
}

.monthly-control-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.monthly-check-group {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 24px;
}

.monthly-check-group label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--midnight-900);
    font-size: 14px;
    font-weight: 600;
}

.monthly-check-group input {
    width: 20px;
    height: 20px;
    margin: 0;
}

.monthly-year-field {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--gray);
    font-size: 12px;
    white-space: nowrap;
}

.monthly-year-field .select,
.monthly-year-field .select-small {
    width: 102px;
    min-width: 102px;
}

.monthly-ledger-section {
    display: grid;
    gap: 16px;
}

.monthly-ledger-section h2 {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: var(--midnight-800);
    font-size: 14px;
    line-height: 20px;
}

.monthly-ledger-section h2 span {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--classic-blue);
}

.monthly-matrix-wrap {
    overflow-x: auto;
}

.monthly-matrix-table {
    width: 100%;
    min-width: 1300px;
    border-collapse: collapse;
    table-layout: fixed;
    border-bottom: 2px solid var(--classic-blue);
    color: var(--deep-black);
}

.monthly-matrix-table th,
.monthly-matrix-table td {
    height: 41px;
    padding: 6px 8px;
    border-bottom: 1px solid #dde2ea;
    text-align: right;
    white-space: nowrap;
}

.monthly-matrix-table thead th {
    height: 28px;
    border-bottom: 1px solid var(--classic-blue);
    color: var(--midnight-800);
    font-size: 11px;
    font-weight: 700;
}

.monthly-matrix-table th:first-child,
.monthly-matrix-table td:first-child {
    width: 168px;
    text-align: left;
}

.monthly-matrix-table tbody th,
.monthly-matrix-table tfoot th {
    color: var(--deep-black);
    font-size: 13px;
    font-weight: 500;
}

.monthly-matrix-table tbody td {
    font-size: 15px;
}


.monthly-matrix-table tfoot th,
.monthly-matrix-table tfoot td {
    height: 44px;
    border-top: 1px solid var(--classic-blue);
    border-bottom: 0;
    font-weight: 800;
}

.ledger-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 16px;
    min-width: 0;
    margin-bottom: 8px;
}

.ledger-active-filter {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    max-width: 220px;
    min-width: 0;
    font-size: 12px;
}

.ledger-active-filter-label {
    flex: 0 0 auto;
    color: var(--text);
    font-weight: 500;
}

.ledger-active-filter .subject-drop-filter-summary-text {
    color: var(--classic-blue);
    font-weight: 700;
}

.collection-review-layout {
    display: grid;
    grid-template-columns: 238px minmax(0, 1fr);
    gap: 18px;
    align-items: start;
}

.collection-review-layout.without-groups {
    display: block;
}

.collection-review-content {
    min-width: 0;
}

.collection-group-nav {
    position: sticky;
    top: 18px;
    overflow: hidden;
    border: 1px solid #d9e0e7;
    border-radius: 10px;
    background: linear-gradient(180deg, #f7faf9 0%, #ffffff 44%);
}

.collection-group-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 16px;
    border-bottom: 1px solid #e3e8ec;
}

.collection-group-header > div {
    display: grid;
    gap: 2px;
}

.collection-group-header span,
.collection-group-item small {
    color: var(--gray);
    font-size: 11px;
}

.collection-group-header strong {
    color: var(--midnight-900);
    font-size: 16px;
}

.collection-group-list {
    display: grid;
    gap: 3px;
    max-height: 620px;
    overflow-y: auto;
    padding: 10px 10px 12px;
}

.collection-group-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    width: 100%;
    min-height: 52px;
    border: 1px solid transparent;
    border-radius: 7px;
    background: transparent;
    padding: 8px 10px;
    color: #26353c;
    text-align: left;
    cursor: pointer;
}

.collection-group-item > span {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.collection-group-item strong {
    overflow: hidden;
    font-size: 13px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.collection-group-item b {
    min-width: 30px;
    border-radius: 999px;
    background: #edf1f3;
    padding: 3px 7px;
    color: #526069;
    font-size: 11px;
    text-align: center;
}

.collection-group-item:hover {
    background: #f3f7f5;
}

.collection-group-item.active {
    border-color: #a8c6bd;
    background: #e7f2ee;
    color: #123f34;
}

.collection-group-item.active b {
    background: #1f6857;
    color: #ffffff;
}

.collection-period-field {
    align-items: flex-start;
}

.ledger-toolbar:not(.secondary) {
    flex-wrap: wrap;
    gap: 8px;
}

.ledger-filter-actions {
    align-items: center;
    display: inline-flex;
    flex: 0 0 auto;
    gap: 8px;
    min-width: 0;
}

.ledger-toolbar.secondary {
    justify-content: space-between;
    gap: 12px;
    margin-top: 8px;
    margin-bottom: 10px;
}

.list-toolbar {
    align-items: stretch;
}

.list-toolbar-info {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.list-toolbar-groups {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    min-width: 0;
}

.list-toolbar-group {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    min-width: 0;
    border-left: 1px solid var(--pale-light-gray);
    padding-left: 10px;
}

.list-toolbar-group:first-child {
    border-left: 0;
    padding-left: 0;
}

.transaction-action-group {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.transaction-action-group + .transaction-action-group {
    margin-left: 4px;
    padding-left: 12px;
    border-left: 1px solid var(--pale-light-gray);
}

.classification-lock-modal {
    width: min(440px, calc(100vw - 32px));
    grid-template-columns: minmax(0, 1fr);
}

.export-modal {
    width: min(440px, calc(100vw - 32px));
    grid-template-columns: minmax(0, 1fr);
}

.export-options {
    display: grid;
    gap: 16px;
}

.classification-lock-modal .modal-body {
    display: grid;
    gap: 14px;
}

.classification-lock-modal .modal-body p {
    margin: 0;
    color: var(--gray);
    font-size: 14px;
    line-height: 20px;
}

.classification-lock-modal textarea {
    resize: vertical;
}

.ledger-toolbar .btn-outline,
.ledger-toolbar .btn-primary,
.topbar-actions .btn-outline,
.topbar-actions .btn-primary {
    padding: 0 12px;
    line-height: 1;
    white-space: nowrap;
}

.ledger-book-picker,
.ledger-search-field {
    position: relative;
    display: inline-flex;
    align-items: center;
    min-width: 0;
}

.ledger-toolbar:not(.secondary) .select {
    min-width: 118px;
}

.ledger-toolbar:not(.secondary) .filter-input {
    min-width: 0;
}

.select-popover-host {
    position: relative;
    display: inline-flex;
}

.custom-select-trigger {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding-left: 12px;
}

.custom-select-trigger span {
    white-space: nowrap;
}

.ledger-picker-popover,
.calendar-popover {
    position: absolute;
    z-index: 30;
    border: 1px solid var(--pale-light-gray);
    border-radius: 8px;
    background: var(--pure-white);
    box-shadow: 0 12px 28px rgba(12, 27, 84, 0.16);
}

.ledger-picker-popover {
    top: calc(100% + 8px);
    left: 0;
    width: 260px;
    padding: 12px 16px 14px;
}

.picker-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    overflow: hidden;
    margin-bottom: 12px;
    border-radius: 3px;
    background: #f2f4f6;
}

.picker-actions button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 30px;
    border: 0;
    background: transparent;
    color: var(--midnight-800);
    cursor: pointer;
    font-size: 12px;
    font-weight: 700;
}

.picker-actions button + button {
    border-left: 1px solid #dde2ea;
}

.picker-option-list {
    display: grid;
    gap: 10px;
}

.picker-option-list label {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--midnight-800);
    font-size: 14px;
}

.picker-option-list input,
.monthly-check-group input {
    margin: 0;
}

.ledger-field-icon {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
}

.ledger-book-picker .ledger-field-icon {
    left: 12px;
}

.ledger-book-select {
    height: 28px;
    border: 1px solid var(--midnight-800);
    border-radius: 2px;
    background: var(--pure-white);
    color: var(--midnight-800);
    cursor: pointer;
    padding: 0 12px;
    font-size: 13px;
    font-weight: 600;
    appearance: none;
}

.ledger-advanced-filters {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 16px;
    margin: 0 0 8px;
    padding: 10px 12px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 4px;
    background: #fafbfc;
}

.advanced-filter-toggle {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.inline-field {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 8px;
    color: var(--gray);
    font-size: 12px;
}

.period-range-tool {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.period-preset-toggle {
    height: 28px;
    min-height: 28px;
    padding: 0 10px;
    white-space: nowrap;
    font-size: 12px;
}

.date-range-picker {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--gray);
}

.date-field {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-width: 128px;
    height: 28px;
    min-height: 28px;
    border: 1px solid var(--pale-gray);
    border-radius: 2px;
    background: var(--pure-white);
    color: var(--midnight-900);
    cursor: pointer;
    padding: 0 10px;
    font-size: 13px;
}

.date-range-picker.compact {
    gap: 4px;
}

.date-range-picker.compact .date-field {
    justify-content: center;
    min-width: 96px;
    padding: 0 8px;
    font-size: 12px;
}

.calendar-popover {
    top: calc(100% + 8px);
    left: -120px;
    width: 265px;
    padding: 20px;
}

.calendar-popover.range-calendar-popover {
    border: 0;
    border-radius: 6px;
    box-shadow: 0 10px 15px rgba(0, 0, 0, 0.1);
}

.calendar-popover header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
    color: var(--midnight-900);
}

.range-calendar-popover header .icon-button,
.range-calendar-popover header .icon-button img {
    width: 24px;
    height: 24px;
}

.range-calendar-popover header strong {
    font-size: 14px;
    font-weight: 500;
    line-height: 14px;
}

.calendar-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
}

.range-calendar-popover .calendar-grid {
    grid-template-columns: repeat(7, 24px);
    justify-content: space-between;
    column-gap: 0;
    row-gap: 4px;
}

.calendar-grid.weekdays {
    margin-bottom: 8px;
}

.range-calendar-popover .calendar-grid.weekdays {
    margin-bottom: 12px;
}

.calendar-grid span,
.calendar-grid button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: 0;
    border-radius: 14px;
    background: transparent;
    color: var(--midnight-900);
    font-size: 13px;
}

.calendar-grid.weekdays span {
    color: var(--mid-gray);
    font-size: 11px;
}

.range-calendar-popover .calendar-grid span,
.range-calendar-popover .calendar-grid button {
    width: 24px;
    height: 24px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 500;
    line-height: 14px;
}

.range-calendar-popover .calendar-grid.weekdays span {
    height: 12px;
    font-size: 12px;
    font-weight: 400;
    line-height: 12px;
}

.calendar-grid button {
    cursor: pointer;
}

.calendar-grid button.muted {
    color: var(--mid-gray);
}

.calendar-grid button.in-range {
    color: var(--midnight-900);
}

.calendar-grid button.selected {
    background: var(--midnight-900);
    color: var(--pure-white);
    font-weight: 800;
}

.calendar-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 14px;
    color: var(--gray);
    font-size: 12px;
    font-weight: 700;
}

.calendar-actions .btn-outline {
    min-height: 28px;
    padding: 0 12px;
    font-size: 12px;
}

.select.compact {
    min-width: 112px;
}

.ledger-search-field .ledger-field-icon {
    right: 10px;
}

.search-input-shell {
    position: relative;
    display: inline-flex;
    align-items: center;
    width: 100%;
    min-width: 0;
}

.search-input-control {
    position: relative;
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    border: 1px solid var(--pale-gray);
    border-radius: 2px;
    background: var(--pure-white);
    transition: background-color 120ms ease, border-color 120ms ease;
}

.search-input-control.search-input-small {
    height: 28px;
    padding: 0 8px;
}

.search-input-control.search-input-medium {
    height: 36px;
    padding: 0 10px;
}

.search-input-control.search-input-large {
    height: 48px;
    padding: 0 12px;
}

.search-input-control:hover {
    border-color: var(--mid-gray);
    background: #f9fbfd;
}

.search-input-control:focus-within,
.search-input-control:has(.search-input-field.has-clear) {
    border-color: var(--midnight-900);
    background: var(--pure-white);
}

.search-input-control > .search-icon {
    position: static;
    flex: 0 0 auto;
    transform: none;
    pointer-events: none;
}

.search-input-field {
    flex: 1 1 auto;
    min-width: 0;
}

.search-input-control .search-input-field {
    width: auto;
    height: 100%;
    min-height: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    outline: 0;
    background: transparent;
    box-shadow: none;
}

.search-input-control .search-input-field:hover,
.search-input-control .search-input-field:focus {
    border: 0;
    background: transparent;
    box-shadow: none;
}

.search-input-shell .search-input-clear {
    position: static;
    flex: 0 0 auto;
    transform: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border: 0;
    border-radius: 2px;
    padding: 0;
    margin: 0;
    background: transparent;
    color: var(--midnight-800);
    cursor: pointer;
    line-height: 1;
}

.search-input-shell .search-input-clear:hover {
    background: #f1f4f8;
}

.search-input-shell .search-input-clear:focus-visible {
    outline: 2px solid var(--midnight-300);
    outline-offset: 1px;
}

.search-input-shell .search-input-field.has-end-icon {
    padding-right: 0;
}

.search-input-shell .search-input-field.has-clear {
    border-color: transparent;
}

.ledger-search-field {
    flex: 0 1 200px;
    width: 200px;
    max-width: 200px;
}

.ledger-search-field .search-input-clear {
    right: 10px;
}

.ledger-search {
    width: 100%;
    padding-right: 34px;
    padding-left: 12px;
}

.ledger-summary {
    color: var(--midnight-900);
    font-size: 14px;
}

.ledger-summary strong {
    margin-left: 8px;
}

.workspace-list,
.assignment-grid,
.bar-chart,
.state-grid {
    margin-top: 24px;
}

.declaration-trend-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 12px;
    margin-top: 24px;
}

.declaration-trend-bars {
    display: grid;
    gap: 10px;
    margin-top: 14px;
}

.declaration-trend-row {
    display: grid;
    grid-template-columns: 44px minmax(80px, 1fr) 88px;
    gap: 10px;
    align-items: center;
    font-size: 12px;
    color: var(--gray);
}

.declaration-trend-row strong {
    color: var(--midnight-900);
    text-align: right;
}

.declaration-trend-track {
    height: 8px;
    overflow: hidden;
    border-radius: 999px;
    background: var(--pale-light-gray);
}

.declaration-trend-track i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: var(--classic-blue);
}

.statement-table th:first-child {
    min-width: 180px;
}

.statement-table td:not(:first-child),
.statement-table th:not(:first-child) {
    text-align: right;
}

.statement-table .statement-parent-row th,
.statement-table .statement-parent-row td,
.statement-table tfoot th,
.statement-table tfoot td {
    font-weight: 700;
    color: var(--deep-black);
    background: var(--midnight-25);
}

.statement-table .statement-child-row th {
    padding-left: 24px;
    color: var(--gray);
    font-weight: 500;
}

.account-trend-layout {
    display: grid;
    grid-template-columns: minmax(220px, 280px) minmax(0, 1fr);
    gap: 18px;
    margin-top: 18px;
}

.account-trend-list {
    min-width: 0;
    border: 1px solid var(--pale-light-gray);
    border-radius: 8px;
    background: var(--pure-white);
    align-self: start;
}

.account-trend-list .section-title {
    padding: 12px;
    border-bottom: 1px solid var(--pale-light-gray);
}

.account-trend-items {
    display: grid;
    max-height: 620px;
    overflow: auto;
}

.account-trend-items button {
    width: 100%;
    padding: 10px 12px;
    border: 0;
    border-bottom: 1px solid var(--pale-light-gray);
    background: var(--pure-white);
    color: var(--midnight-900);
    text-align: left;
    cursor: pointer;
}

.account-trend-items button.child {
    padding-left: 26px;
    color: var(--gray);
}

.account-trend-items button.active {
    background: var(--classic-blue-25);
    color: var(--classic-blue);
    font-weight: 700;
}

.account-trend-detail {
    min-width: 0;
}

.panel-header.compact {
    margin-bottom: 14px;
}

.account-trend-chart {
    display: grid;
    gap: 12px;
    padding: 16px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 8px;
    background: var(--pure-white);
}

.account-trend-bar-row {
    display: grid;
    grid-template-columns: 72px minmax(100px, 1fr) 120px;
    gap: 12px;
    align-items: center;
    color: var(--gray);
    font-size: 13px;
}

.account-trend-bar-row strong {
    color: var(--midnight-900);
    text-align: right;
}

.account-trend-track {
    height: 10px;
    overflow: hidden;
    border-radius: 999px;
    background: var(--pale-light-gray);
}

.account-trend-track i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: var(--classic-blue);
}

.workspace-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 16px;
    align-items: center;
    min-height: 64px;
    border-bottom: 1px solid var(--pale-light-gray);
}

.workspace-row:last-child {
    border-bottom: 0;
}

.workspace-row strong,
.workspace-row span {
    display: block;
}

.workspace-row strong {
    color: var(--deep-black);
    line-height: 21px;
}

.workspace-row span,
.workspace-stats {
    color: var(--gray);
    font-size: 12px;
}

.workspace-stats {
    display: flex;
    gap: 8px;
}

.bar-row {
    display: grid;
    grid-template-columns: 160px minmax(0, 1fr) 120px;
    gap: 12px;
    align-items: center;
    min-height: 48px;
    color: var(--dark-gray);
}

.bar-track {
    display: grid;
    gap: 4px;
}

.bar {
    height: 10px;
    border-radius: 6px;
}

.bar.income {
    background: #2f6de1;
}

.bar.expense {
    background: #e3222f;
}

.cost-breakdown-list {
    display: grid;
    gap: 18px;
    margin-top: 24px;
}

.cost-breakdown-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px 16px;
    align-items: center;
}

.cost-breakdown-meta {
    min-width: 0;
}

.cost-breakdown-meta strong,
.cost-breakdown-meta span,
.cost-breakdown-value span,
.cost-breakdown-value small,
.cost-formula-table td span {
    display: block;
}

.cost-breakdown-meta strong {
    color: var(--deep-black);
    font-size: 14px;
    line-height: 20px;
}

.cost-breakdown-meta span,
.cost-breakdown-value small,
.cost-formula-table td span {
    color: var(--gray);
    font-size: 12px;
    line-height: 18px;
}

.cost-breakdown-value {
    min-width: 104px;
    text-align: right;
}

.cost-breakdown-track {
    grid-column: 1 / -1;
    height: 8px;
    overflow: hidden;
    border-radius: 999px;
    background: var(--midnight-50);
}

.cost-breakdown-track span {
    display: block;
    height: 100%;
    min-width: 4px;
    border-radius: inherit;
}

.cost-breakdown-track span.expense {
    background: var(--deep-rose);
}

.cost-breakdown-track span.income {
    background: var(--classic-blue);
}

.cost-formula-table td:first-child {
    min-width: 164px;
}

.cost-formula-table td strong {
    display: block;
    color: var(--deep-black);
    font-size: 13px;
}

.assignment-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.state-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.assignment-card {
    min-height: 150px;
    padding: 18px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 8px;
    background: var(--paper-white);
}

.state-card {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-height: 188px;
    padding: 18px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 8px;
    background: var(--paper-white);
}

.state-card.warning {
    background: #fff8ea;
}

.state-card.danger {
    background: #fff4f5;
}

.assignment-card h3 {
    margin-top: 12px;
}

.assignment-card p,
.state-card p {
    margin-top: 4px;
    color: var(--gray);
}

.state-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: auto;
}

.state-actions span {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 4px 10px;
    border: 1px solid var(--pale-gray);
    border-radius: 2px;
    background: var(--pure-white);
    color: var(--midnight-800);
    font-size: 12px;
    font-weight: 600;
}

.scope-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 14px;
}

.scope-list.large {
    margin-top: 24px;
}

.scope-list.large span {
    min-height: 32px;
    padding-inline: 14px;
}

.scope-list span,
.badge,
.chip {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 4px 10px;
    border-radius: 12px;
    background: var(--midnight-100);
    color: var(--midnight-800);
    font-size: 12px;
    font-weight: 600;
    gap: 4px;
}

.badge.soft,
.chip {
    border-color: transparent;
    background: var(--midnight-50);
    color: var(--midnight-600);
}

.badge.danger {
    background: #ffe8ea;
    color: var(--deep-rose);
}

.chip.active {
    background: var(--midnight-800);
    color: var(--pure-white);
}

.table-wrap {
    max-width: 100%;
    min-width: 0;
    overflow-x: auto;
    margin-top: 16px;
}

.table-wrap.compact {
    margin-top: 16px;
}

.data-table {
    width: 100%;
    min-width: 760px;
    border-collapse: collapse;
    font-size: 0.75rem;
    line-height: 1.5;
    border-collapse: separate;
    border-spacing: 0;
}

.data-table thead th {
    padding: 6px 8px;
    border-bottom: 1px solid var(--midnight-600);
    color: var(--midnight-800);
    font-size: 0.625rem;
    font-weight: 500;
    height: 28px;
    text-align: left;
    white-space: nowrap;
}

.data-table tbody th,
.data-table tbody td {
    height: 44px;
    padding: 6px 8px;
    border-bottom: 1px solid var(--pale-light-gray);
    text-align: left;
    white-space: nowrap;
}

.data-table .is-numeric-col,
.data-table .total-col,
.data-table .amount-income,
.data-table .amount-expense {
    text-align: right;
}

.data-table th.is-numeric-col .table-sort {
    width: 100%;
    text-align: right;
}

.data-table .sum-col {
    background: var(--midnight-25);
    font-weight: 700;
}

.data-table th.amount-cell,
.data-table td.amount-cell,
.data-table th.sum-col,
.data-table td.sum-col,
.data-table th.total-col,
.data-table td.total-col {
    text-align: right;
}

.data-table tfoot th,
.data-table tfoot td  {
    height: 48px;
    border-bottom: 0;
    font-weight: 700;
    border-top: 1px solid var(--midnight-600) !important;
}

.account-cell {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.account-cell span:last-child {
    overflow: hidden;
    text-overflow: ellipsis;
}


.total-col {
    background: #f1f5fb;
    font-weight: 700;
}

.weekday {
    color: var(--classic-blue);
    font-weight: 700;
}

.weekday.sunday {
    color: var(--deep-rose);
}

.weekday.saturday {
    color: var(--classic-blue);
}

.table-sort {
    border: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
    font: inherit;
    font-size: 12px;
    font-weight: 700;
    padding: 0;
    text-align: left;
    white-space: nowrap;
}

.amount-cell .table-sort {
    text-align: right;
}

.filter-input {
    min-width: 220px;
    height: 32px;
    border: 1px solid var(--pale-gray);
    border-radius: 2px;
    background: var(--pure-white);
    color: var(--deep-black);
    padding: 0 10px;
}

.pager {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: 20px;
    color: var(--gray);
    font-size: 12px;
}

.pager-meta {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 10px 14px;
    flex: 1 1 auto;
    min-width: 0;
    overflow-x: auto;
    white-space: nowrap;
}

.pager-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex: 0 0 auto;
    margin-left: auto;
}

.pager-actions .btn-small {
    min-width: 52px;
}

.page-size-field {
    min-height: 32px;
}

.infinite-load-sentinel {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    margin-top: 8px;
    color: var(--gray);
    font-size: 12px;
}

.btn-outline:disabled,
.btn-primary:disabled {
    cursor: not-allowed;
    opacity: 0.45;
}

.footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    min-height: 40px;
    margin-top: 48px;
    padding-top: 1rem;
    border-top: 1px solid var(--pale-light-gray);
    color: var(--mid-gray);
    font-size: 10px;
    font-weight: 500;
}

.footer img {
    width: 24px;
    height: 24px;
    object-fit: contain;
}
.footer em {
    font-style: normal;
    color: var(--dark-gray);
}

.error-copy {
    margin-top: 24px;
    color: var(--gray);
}

.error-detail {
    overflow-x: auto;
    margin-top: 24px;
    max-height: 520px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 8px;
    background: var(--paper-white);
    color: var(--deep-black);
    padding: 16px;
    white-space: pre-wrap;
}

.amount-income {
    color: var(--classic-blue);
    font-weight: 700;
    text-align: right;
}

.amount-expense {
    color: var(--deep-rose);
    font-weight: 700;
    text-align: right;
}

.login-page {
    display: grid;
    grid-template-columns: minmax(420px, 700px) 400px;
    align-items: center;
    justify-content: center;
    gap: 60px;
    min-height: 100vh;
    padding: 64px;
    background: var(--paper-white);
}

.surface-portal {
    display: grid;
    grid-template-columns: minmax(380px, 560px) minmax(420px, 760px);
    align-items: center;
    justify-content: center;
    gap: 64px;
    min-height: 100vh;
    padding: 64px;
    background: linear-gradient(90deg, rgba(249, 249, 247, 0.96), rgba(255, 255, 255, 0.98));
}

.portal-copy {
    display: flex;
    flex-direction: column;
    gap: 28px;
}

.portal-copy .brand {
    margin-bottom: 24px;
}

.portal-copy h1 {
    color: var(--midnight-800);
    font-family: var(--font-serif);
    font-size: 44px;
    line-height: 1.42;
}

.portal-copy p {
    color: var(--midnight-600);
    font-size: 16px;
    line-height: 1.7;
}

.portal-actions {
    display: grid;
    gap: 16px;
}

.surface-card {
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-height: 180px;
    padding: 24px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 8px;
    background: var(--pure-white);
    box-shadow: var(--shadow-100);
}

.surface-card:hover {
    border-color: var(--midnight-300);
}

.surface-card p {
    color: var(--gray);
    line-height: 1.6;
}

.login-hero {
    width: min(100%, 700px);
    aspect-ratio: 1;
    border-radius: 8px;
    background:
        url("images/bg-login-banner.png") center / cover no-repeat,
        linear-gradient(135deg, #edf4ff, #ffffff);
    box-shadow: var(--shadow-100);
    overflow: hidden;
    padding: 60px 44px;
}

.hero-copy {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 100px;
    color: var(--midnight-800);
}

.hero-copy h1 {
    color: var(--midnight-800);
    font-family: var(--font-serif);
    font-size: 44px;
    font-weight: 400;
    line-height: 1.5;
}
.hero-copy div {
    display:flex;
    flex-direction: column;
    gap: 30px;
}
.hero-copy p {
    color: var(--midnight-600);
    font-family: var(--font-serif);
    font-size: 24px;
    line-height: 1.5;
}

.hero-copy span {
    color: var(--midnight-800);
    font-weight: 600;
    font-size: 1rem;
}

.login-panel {
    display: flex;
    flex-direction: column;
    max-width: 400px;
    min-width: 320px;
    gap: 80px;
    margin: 0 auto;
}
.login-form {
    display: flex;
    flex-direction: column;
    gap: 40px;

}

.brand {
    display: flex;
    align-items: center;
    color: var(--midnight-800);
    font-size: 30px;
}

.brand-logo {
    display: block;
}

.brand-mark {
    width: 44px;
    height: 44px;
    border-radius: 8px;
    background: var(--pure-white);
    border: 3px solid var(--midnight-800);
    color: var(--midnight-800);
}

.brand-mark img {
    width: 24px;
    height: 24px;
    object-fit: contain;
}

.brand.compact {
    margin-bottom: 0;
    font-size: 22px;
}

.brand.compact .brand-logo {
    width: auto;
    height: 42px;
}

.brand.compact .brand-mark {
    width: 42px;
    height: 42px;
    border-width: 2px;
}

.field {
    display: grid;
    gap: 0.25rem;
    color: var(--dark-gray);
    font-size: 14px;
}

.field span {
    color: var(--midnight-900);
    font-weight: 400;
    font-size: 0.75rem;
}

.field input,
.field select,
.field textarea,
.input-large,
.input-medium,
.input-small {
    width: 100%;
    border: 1px solid var(--pale-gray);
    background: var(--pure-white);
    color: var(--deep-black);
    transition: border-color 120ms ease, box-shadow 120ms ease, background-color 120ms ease;
}

.field input:focus,
.field select:focus,
.field textarea:focus,
.input-large:focus,
.input-medium:focus,
.input-small:focus {
    outline: none;
    border-color: var(--midnight-900);
    box-shadow: none;
}

.field.field-large input,
.input-large {
    height: 48px;
    padding: 0 12px;
    font-size: 16px;
    line-height: 24px;
}

.field.field-medium input,
.input-medium {
    height: 36px;
    padding: 0 10px;
    font-size: 14px;
    line-height: 21px;
}

.field.field-small input,
.input-small {
    height: 28px;
    padding: 0 8px;
    font-size: 12px;
    line-height: 18px;
}

.login-options {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: var(--midnight-800);
    font-size: 0.875rem;
}

.login-panel small {
    color: var(--mid-gray);
    text-align: center;
    font-size: 0.625rem;
    line-height: 1;
}
.login-panel small em {
    color: var(--dark-gray);
    font-style: normal;
}

.dashboard-page {
    background: var(--pure-white);
}

.dashboard-workspace-picker {
    position: relative;
    min-width: 220px;
}

.dashboard-workspace-trigger {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    width: 100%;
    min-height: 44px;
    padding: 6px 8px 6px 12px;
    border: 1px solid var(--pale-gray);
    border-radius: 2px;
    background: var(--pure-white);
    color: var(--midnight-900);
    text-align: left;
}

.dashboard-workspace-trigger[aria-expanded="true"] {
    border-color: var(--midnight-900);
    background: var(--midnight-15);
}

.dashboard-workspace-trigger-copy {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}

.dashboard-workspace-trigger-copy small {
    color: var(--gray);
    font-size: 10px;
    line-height: 14px;
}

.dashboard-workspace-trigger-copy strong {
    overflow: hidden;
    font-size: 13px;
    line-height: 18px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-workspace-options {
    position: absolute;
    z-index: 20;
    top: calc(100% + 8px);
    right: 0;
    width: 280px;
    overflow: hidden;
    border: 1px solid var(--pale-light-gray);
    border-radius: 2px;
    background: var(--pure-white);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.dashboard-workspace-option {
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    width: 100%;
    min-height: 48px;
    padding: 8px 12px;
    border: 0;
    border-bottom: 1px solid var(--midnight-25);
    background: var(--pure-white);
    color: var(--midnight-900);
    text-align: left;
}

.dashboard-workspace-option:last-child {
    border-bottom: 0;
}

.dashboard-workspace-option:hover,
.dashboard-workspace-option.selected {
    background: var(--midnight-25);
}

.dashboard-workspace-option > span:nth-child(2) {
    overflow: hidden;
    font-size: 13px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-workspace-option small {
    color: var(--midnight-600);
    font-size: 11px;
}

.dashboard-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 24px;
}

.period-filter {
    display: flex;
    justify-content: flex-end;
    gap: 0;
    margin-bottom: 38px;
}

.period-range-tool .period-filter,
.subject-toolbar .period-filter {
    flex: 0 0 auto;
    margin-bottom: 0;
}

.period-filter button {
    min-width: 44px;
    height: 28px;
    border: 0;
    background: #f2f4f6;
    color: var(--gray);
    cursor: pointer;
    padding: 0 10px;
    font-size: 12px;
    font-weight: 500;
}

.period-filter button:first-child {
    border-radius: 2px 0 0 2px;
}

.period-filter button:last-child {
    border-right: 0;
    border-radius: 0 2px 2px 0;
}
.period-filter button:hover {
    color: var(--midnight-900);
}

.period-filter button.active {
    background: var(--pure-white);
    color: var(--midnight-900);
    box-shadow: inset 0 0 0 1px var(--pale-light-gray);
}

.dashboard-period-row {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 38px;
}

.dashboard-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
    margin-bottom: 24px;
}

.dashboard-card,
.dashboard-panel {
    border: 1px solid var(--pale-light-gray);
    border-radius: 8px;
    background: var(--pure-white);
    box-shadow: var(--shadow-100);
}

.dashboard-card {
    min-height: 132px;
    padding: 24px;
}

.dashboard-card .card-title {
    padding-bottom: 14px;
}

.card-icon {
    display: inline-flex;
    color: var(--midnight-800);
}

.dashboard-card.expense .metric-amount {
    color: var(--deep-rose);
}

.dashboard-card.income .metric-amount,
.dashboard-card.asset .metric-amount {
    color: var(--classic-blue);
}

.dashboard-split {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 36px;
    margin-bottom: 36px;
}

.dashboard-panel {
    padding: 24px 32px;
    margin-bottom: 36px;
}

.dashboard-panel .panel-header {
    padding-bottom: 18px;
    border-bottom: 1px solid var(--pale-light-gray);
}

.dashboard-panel h2 {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--midnight-800);
}

.tax-card-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 32px;
    padding-top: 22px;
}

.tax-card-grid div {
    display: grid;
    gap: 10px;
}

.tax-card-grid strong {
    color: var(--deep-black);
    font-size: 14px;
    line-height: 21px;
}

.tax-card-grid span {
    color: var(--deep-black);
    font-size: 13px;
}

.tax-card-grid em {
    display: inline-flex;
    margin-left: 8px;
    padding: 3px 8px;
    border-radius: 2px;
    background: #f2f4f6;
    color: var(--gray);
    font-style: normal;
    font-size: 11px;
}

.tax-card-grid b {
    margin-top: 4px;
    color: var(--classic-blue);
    font-size: 24px;
    line-height: 32px;
}

.chart-panel {
    min-height: 320px;
}

.chart-legend {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: var(--gray);
    font-size: 12px;
}

.chart-legend span::before {
    content: "";
    display: inline-block;
    width: 10px;
    height: 10px;
    margin-right: 4px;
    border-radius: 1px;
}

.income-dot::before {
    background: #004C97;
}

.expense-dot::before {
    background: #E52334;
}

.month-chart {
    display: grid;
    grid-template-columns: repeat(6, minmax(54px, 1fr));
    align-items: end;
    gap: 28px;
    min-height: 210px;
    margin-top: 28px;
    padding: 10px 48px 0;
    border-bottom: 1px solid var(--pale-light-gray);
    background:
        repeating-linear-gradient(to top, transparent 0, transparent 39px, #edf0f3 40px);
}

.month-group {
    display: grid;
    align-items: end;
    gap: 10px;
    height: 210px;
    text-align: center;
}

.month-bars {
    display: flex;
    align-items: end;
    justify-content: center;
    gap: 8px;
    height: 170px;
}

.month-bars span {
    display: block;
    width: 28px;
    border-radius: 2px 2px 0 0;
}

.income-bar {
    background: #004C97;
}

.expense-bar {
    background: #E52334;
}

.month-group strong {
    color: var(--gray);
    font-size: 12px;
    font-weight: 500;
}

.dashboard-table {
    min-width: 900px;
}

.dashboard-table thead th {
    border-bottom: 1px solid var(--classic-blue);
}

.ledger-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 16px 0 4px;
    padding-top: 16px;
    border-top: 1px solid var(--pale-light-gray);
}

.ledger-tabs a {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 6px 12px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 2px;
    background: var(--pure-white);
    color: var(--gray);
    font-size: 12px;
    font-weight: 600;
}

.ledger-tabs a.active {
    border-color: var(--midnight-800);
    background: var(--midnight-800);
    color: var(--pure-white);
}

.modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: rgba(12, 27, 84, 0.24);
}

.figma-modal {
    display: grid;
    gap: 20px;
    width: min(500px, calc(100vw - 48px));
    padding: 24px 32px;
    border: 0;
    border-radius: 8px;
    background: var(--paper-white);
    box-shadow: 0 16px 32px -4px rgba(12, 12, 13, 0.1), 0 4px 4px -4px rgba(12, 12, 13, 0.05);
}

.figma-modal.batch-modal {
    gap: 24px;
    width: min(440px, 100%);
    padding: 24px 32px;
    border: 0;
    border-radius: 8px;
    background: var(--paper-white);
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.16);
}

.batch-modal > header {
    min-height: 24px;
}

.batch-modal > header h2 {
    color: var(--deep-black);
    font-size: 18px;
    line-height: 24px;
}

.batch-modal-close {
    width: 24px;
    height: 24px;
}

.batch-modal-close img {
    width: 24px;
    height: 24px;
}

.batch-modal-card {
    display: grid;
    gap: 8px;
    padding: 32px 24px 24px;
    border-radius: 8px;
    background: var(--pure-white);
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.05);
}

.batch-edit-row {
    display: grid;
    grid-template-columns: 20px 68px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
}

.batch-edit-row > input[type="checkbox"] {
    width: 20px;
    height: 20px;
}

.batch-edit-row > label {
    color: var(--midnight-800);
    font-size: 12px;
    line-height: 18px;
}

.batch-edit-row > select,
.batch-edit-row > input:not([type="checkbox"]) {
    width: 100%;
}

.batch-modal-note {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-top: 16px;
    padding: 10px 16px;
    border-radius: 8px;
    background: var(--midnight-15);
    color: var(--midnight-800);
}

.batch-modal-note .ds-icon {
    flex: 0 0 auto;
    margin-top: 1px;
}

.batch-modal-note p {
    color: var(--midnight-800);
    font-size: 11px;
    line-height: 17px;
}

.batch-modal-note strong {
    font-weight: 700;
}

.batch-modal > footer {
    gap: 0;
}

.batch-modal > footer .btn-medium {
    width: 150px;
    justify-content: center;
}

.figma-modal.reset-password-modal {
    gap: 18px;
    width: min(440px, 100%);
    max-width: 440px;
}

.modal-header,
.modal-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.modal-body {
    min-width: 0;
}

.modal-close-button {
    width: 24px;
    height: 24px;
}

.account-delete-modal {
    display: flex;
    overflow: hidden;
    flex-direction: column;
    gap: 0;
    width: min(440px, 100%);
    padding: 0;
    border: 0;
    background: var(--paper-white);
    box-shadow: 0 16px 32px -4px rgba(12, 12, 13, 0.1), 0 4px 4px -4px rgba(12, 12, 13, 0.05);
}

.account-delete-modal .modal-header,
.account-delete-modal .modal-footer {
    width: 100%;
    padding: 24px 32px;
}

.account-delete-modal .modal-close-button img {
    width: 24px;
    height: 24px;
}

.account-delete-body {
    display: flex;
    flex-direction: column;
    gap: 24px;
    align-items: center;
    margin: 0 32px;
    padding: 24px;
    border-radius: 8px;
    background: var(--pure-white);
    box-shadow: 0 1px 2px rgba(12, 12, 13, 0.05);
}

.account-delete-body > p {
    width: 100%;
    font-size: 16px;
    line-height: 24px;
    text-align: center;
}

.account-delete-warning {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
    padding: 8px 16px;
    border-radius: 8px;
    background: #fef6f7;
}

.account-delete-warning span {
    display: flex;
    align-items: center;
    gap: 4px;
    color: var(--deep-rose);
    font-size: 12px;
    line-height: 18px;
}

.account-delete-confirm {
    display: grid;
    gap: 4px;
    width: 100%;
}

.account-delete-confirm > span {
    color: var(--dark-gray);
    font-size: 12px;
    line-height: 18px;
}

.account-delete-modal .modal-footer button {
    width: 150px;
    justify-content: center;
}

.account-delete-modal .modal-footer .btn-primary:disabled {
    border-color: var(--midnight-200);
    background: var(--midnight-200);
    color: var(--pure-white);
}

.modal-footer {
    justify-content: space-between;
    gap: 12px;
    margin-top: 0;
}

.modal-header h2 {
    color: var(--midnight-900);
    font-family: var(--font-serif);
    font-size: 18px;
    line-height: 1;
    margin: 0;
}

.modal-header h2.danger {
    color: var(--deep-rose);
}

.figma-modal p {
    color: var(--deep-black);
    font-size: 1rem;
    line-height: 1.5;
    margin: 0;
}

.modal-title-group {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.modal-copy-block {
    padding: 18px 0 4px;
}

.modal-copy-block p {
    text-align: center;
    font-size: 15px;
    color: var(--dark-gray);
}

.modal-card {
    display: grid;
    gap: 24px;
    padding: 24px;
    border-radius: 8px;
    background: var(--pure-white);
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.05);
}

.modal-form-grid {
    display: grid;
    gap: 16px;
}

/* Modal field styles now use reusable field size classes */

.modal-actions {
    display: flex;
    justify-content: space-between;
}

.modal-eyebrow {
    margin: 0 0 6px;
    color: var(--midnight-600);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0;
}

.modal-eyebrow.danger {
    color: var(--deep-rose);
}

.ledger-detail-modal {
    width: min(560px, 100%);
}

.ledger-delete-modal {
    width: min(440px, 100%);
}

.ledger-detail-hero {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 14px;
    align-items: center;
    padding: 18px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 6px;
    background: #f8fafc;
}

.ledger-detail-hero strong,
.ledger-detail-hero span {
    display: block;
}

.ledger-detail-hero strong {
    color: var(--midnight-900);
    font-size: 18px;
    line-height: 24px;
}

.ledger-detail-hero span {
    margin-top: 4px;
    color: var(--gray);
}

.detail-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 22px;
    background: var(--pure-white);
    color: var(--midnight-800);
}

.detail-info-list {
    display: grid;
    margin: 0;
    border-top: 1px solid var(--pale-light-gray);
}

.detail-info-list div {
    display: grid;
    grid-template-columns: 120px minmax(0, 1fr);
    min-height: 42px;
    align-items: center;
    border-bottom: 1px solid var(--pale-light-gray);
}

.detail-info-list dt {
    color: var(--gray);
    font-size: 13px;
}

.detail-info-list dd {
    margin: 0;
    color: var(--midnight-900);
    font-weight: 700;
}

.modal-note,
.delete-warning {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 12px 14px;
    border-radius: 6px;
    background: #f7f9fc;
    color: var(--midnight-800);
}

.modal-note p,
.delete-warning span {
    margin: 0;
    color: var(--midnight-800);
    font-size: 13px;
    line-height: 1.5;
}

.delete-warning {
    background: #fff5f7;
    color: var(--deep-rose);
}

.delete-warning span {
    color: var(--deep-rose);
    font-weight: 700;
}

.modal-footer-actions {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.btn-primary.danger {
    border-color: var(--deep-rose);
    background: var(--deep-rose);
    color: var(--pure-white);
}

.modal-form-grid {
    display: grid;
    gap: 16px;
}

.modal-form-grid label {
    display: grid;
    gap: 8px;
    color: var(--dark-gray);
    font-size: 14px;
}

.modal-form-grid input,
.modal-form-grid select {
    width: 100%;
}

.policy-modal {
    display: flex;
    overflow: hidden;
    flex-direction: column;
    gap: 0;
    width: min(940px, 100%);
    max-height: calc(100vh - 48px);
    padding: 0;
    border: 0;
    background: var(--paper-white);
}

.policy-modal .modal-header,
.policy-modal .modal-footer {
    flex: 0 0 auto;
    padding: 24px 32px;
}

.policy-modal .modal-close-button img {
    width: 24px;
    height: 24px;
}

.policy-modal-body {
    overflow-y: auto;
    max-height: min(600px, calc(100vh - 184px));
    margin: 0 32px;
    padding: 24px;
    border-radius: 8px;
    background: var(--pure-white);
    box-shadow: 0 1px 2px rgba(12, 12, 13, 0.05);
}

.policy-copy {
    color: var(--deep-black);
    font-size: 12px;
    line-height: 18px;
}

.policy-copy h3,
.policy-copy h4,
.policy-copy p,
.policy-copy ul {
    margin: 0 0 16px;
}

.policy-copy h3 {
    font-size: 16px;
    line-height: 24px;
}

.policy-copy h4 {
    font-size: 14px;
    font-weight: 500;
    line-height: 21px;
}

.policy-copy ul {
    display: grid;
    gap: 8px;
    padding-left: 30px;
    list-style: none;
}

.policy-modal .modal-footer {
    justify-content: flex-start;
}

.policy-modal .modal-footer button {
    width: 150px;
    justify-content: center;
}

.setting-shell {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);
    min-height: 100vh;
    background: var(--pure-white);
}

.setting-sidebar {
    position: sticky;
    top: 0;
    height: 100vh;
    border-right: 1px solid var(--pale-light-gray);
    background: #fafafa;
}

.setting-brand {
    display: flex;
    align-items: center;
    gap: 10px;
    height: 56px;
    padding: 0 16px;
    border-bottom: 1px solid var(--pale-light-gray);
}

.setting-brand .icon-button {
    width: 28px;
    height: 28px;
    color: var(--midnight-800);
    font-size: 28px;
    line-height: 1;
}
.setting-brand .brand.compact .brand-logo {
    width: auto;
    height: 24px;
}

.setting-nav {
    display: grid;
    gap: 0;
    padding: 16px;
}

.setting-nav-section {
    border-bottom: 1px solid var(--pale-light-gray);
    padding: 8px 0;
}

.setting-nav-title,
.setting-nav .sub {
    display: flex;
    align-items: center;
    min-height: 40px;
    color: var(--gray);
    font-size: 14px;
    font-weight: 600;
}

.setting-nav-title {
    gap: 10px;
}

.setting-nav .sub {
    margin-left: 22px;
    padding: 0 16px;
    border-radius: 2px;
}

.setting-nav-title.active,
.setting-nav .sub.active,
.setting-nav-title:hover,
.setting-nav .sub:hover {
    color: var(--midnight-900);
}

.setting-nav .sub.active {
    background: var(--pure-white);
}

.setting-nav .sub.active::before {
    content: "";
    width: 4px;
    height: 4px;
    margin-right: 12px;
    border-radius: 50%;
    background: var(--classic-blue);
}

.setting-nav-action {
    margin-left: auto;
}

.setting-main {
    min-width: 0;
    padding: 28px 32px 24px;
}

.setting-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    min-height: 48px;
    margin-bottom: 32px;
}

.setting-topbar h1 {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
    color: var(--classic-blue);
    font-size: 20px;
    font-weight: 700;
}

.setting-topbar h1 strong {
    color: var(--midnight-900);
}

.setting-user {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--midnight-900);
}

.setting-content {
    display: grid;
    gap: 40px;
    max-width: 700px;
    margin: 0 auto;
}

.setting-content.btn-large {
    width: min(100%, 1398px);
    max-width: 1398px;
}

.setting-card {
    display: grid;
    gap: 20px;
    padding: 26px 32px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 8px;
    background: var(--pure-white);
    box-shadow: 0 3px 8px rgba(12, 27, 84, 0.04);
}

.setting-subjects {
    gap: 24px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.setting-card-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--pale-light-gray);
}

.setting-card h2 {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
    color: var(--midnight-800);
    font-family: var(--font-serif);
    font-size: 16px;
    line-height: 24px;
}

.setting-card p {
    margin: 8px 0 0 18px;
    color: var(--gray);
    font-size: 0.75rem;
    line-height: 1;
}

.settings-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 28px;
    background: var(--hospital-sky);
    color: var(--pure-white);
}

.settings-avatar.small {
    width: 48px;
    height: 48px;
}

.setting-definition-list {
    display: grid;
    gap: 0;
    margin: 0;
}

.setting-definition-list div {
    display: grid;
    grid-template-columns: 150px minmax(0, 1fr);
    min-height: 44px;
    align-items: center;
}

.setting-definition-list dt {
    color: var(--gray);
    font-size: 13px;
}

.setting-definition-list dd {
    margin: 0;
    color: var(--midnight-900);
    font-size: 14px;
    font-weight: 600;
}

.setting-card-actions {
    display: flex;
    justify-content: space-between;
}

.basic-setting-card {
    gap: 16px;
    padding: 24px 32px;
}

.basic-setting-card .setting-card-header {
    padding-bottom: 16px;
}

.basic-setting-card h2 > span,
.setting-topbar h1 > span,
.setting-card h2 > span {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--midnight-600);
}

.basic-setting-card .setting-definition-list div {
    grid-template-columns: 140px minmax(0, 1fr);
    min-height: 44px;
}

.basic-setting-card .setting-definition-list dt {
    padding-left: 10px;
}

.basic-setting-card .setting-definition-list dd {
    min-height: 44px;
    padding: 12px 10px;
    font-weight: 500;
}

.basic-setting-card .setting-definition-list .consultant-row {
    margin-top: 8px;
    border-top: 1px dashed var(--pale-light-gray);
}

.basic-setting-card .setting-card-actions {
    gap: 8px;
    padding-top: 0;
    border-top: 1px solid var(--pale-light-gray);
}

.basic-setting-card .setting-card-actions button {
    width: 150px;
    justify-content: center;
    margin-top: 16px;
}

.basic-info-form {
    display: grid;
    gap: 8px;
}

.basic-info-form > label {
    display: grid;
    grid-template-columns: 140px minmax(0, 1fr);
    align-items: center;
    min-height: 36px;
}

.basic-info-form > label > span:first-child {
    padding-left: 10px;
    color: var(--gray);
    font-size: 13px;
}

.basic-info-form input,
.basic-info-form select {
    width: 100%;
}

.basic-address-field {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 42px;
    gap: 8px;
}

.basic-address-field .btn-medium {
    min-width: 42px;
    width: 42px;
    padding: 0;
    justify-content: center;
}

.basic-info-form .consultant-edit-row {
    margin-top: 0;
    padding-top: 8px;
    border-top: 1px dashed var(--pale-light-gray);
}

.consultant-edit-row > span:last-child {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.setting-action-list {
    display: grid;
}

.setting-action-list button {
    display: grid;
    grid-template-columns: minmax(140px, 1fr) minmax(0, auto) auto;
    gap: 12px;
    align-items: center;
    min-height: 44px;
    border: 0;
    border-bottom: 1px solid var(--pale-light-gray);
    background: transparent;
    color: var(--midnight-900);
    font-size: 14px;
    text-align: left;
    cursor: pointer;
}

.setting-action-list strong {
    color: var(--classic-blue);
    font-weight: 600;
}

.setting-danger-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 16px;
    border-radius: 6px;
    background: var(--deep-rose-25);
    color: var(--deep-rose);
}

.setting-danger-row strong {
    color: var(--deep-rose);
    font-size: 0.875rem;
    font-weight: 500;
}
.setting-danger-row p {
    color: var(--deep-rose);
    margin: 8px 0 0 0;
}

.settings-form {
    display: grid;
    gap: 12px;
}

.settings-form label {
    display: grid;
    grid-template-columns: 100px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    color: var(--dark-gray);
    font-size: 14px;
}

.settings-form input,
.settings-form select,
.setting-textarea {
    width: 100%;
    height: 36px;
    border: 1px solid var(--pale-gray);
    border-radius: 2px;
    background: var(--pure-white);
    color: var(--deep-black);
    padding: 0 10px;
}

.setting-textarea {
    min-height: 140px;
    padding: 10px 12px;
    resize: vertical;
}

.settings-form.inline-add {
    grid-template-columns: minmax(0, 1fr) minmax(180px, 260px);
}

.setting-content.btn-large .settings-form.inline-add {
    grid-template-columns: minmax(320px, 1fr) minmax(240px, 320px);
}

.settings-form.inline-add label {
    grid-template-columns: 100px minmax(0, 1fr);
}

.setting-plan-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 208px;
    gap: 8px;
}

.setting-plan-grid article {
    padding: 24px;
    border-radius: 8px;
    background: var(--paper-white);
}

.plan-setting-card {
    gap: 16px;
    padding: 24px 32px;
}

.plan-setting-card .setting-card-header {
    padding-bottom: 0;
    border-bottom: 0;
}

.plan-setting-card h2 > span {
    width: 5px;
    height: 5px;
    border-radius: 50%;
}

.plan-summary-card {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 32px;
}

.plan-summary-head,
.plan-summary-bottom {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.plan-summary-bottom {
    align-items: flex-end;
}

.plan-name {
    display: grid;
    gap: 4px;
}

.plan-name > span {
    display: flex;
    align-items: center;
    gap: 8px;
}

.plan-name strong {
    color: var(--midnight-900);
    font-size: 16px;
    line-height: 16px;
}

.plan-name small {
    padding-left: 32px;
    color: var(--midnight-900);
    font-size: 12px;
}

.setting-plan-grid dl {
    display: grid;
    gap: 8px;
    margin: 0;
}

.setting-plan-grid dl div {
    display: flex;
    gap: 8px;
    align-items: center;
}

.setting-plan-grid dt {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--midnight-900);
    font-size: 12px;
}

.setting-plan-grid dd {
    margin: 0;
    color: var(--midnight-900);
    font-size: 14px;
}

.plan-price {
    padding-top: 4px;
    color: var(--midnight-900);
    font-size: 16px;
}

.plan-price small {
    margin-left: 8px;
    color: var(--midnight-900);
    font-size: 12px;
    font-weight: 400;
}

.plan-summary-bottom .btn-small {
    width: 150px;
    justify-content: center;
}

.plan-feature-card {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 8px;
    padding: 8px 16px !important;
    background: var(--midnight-25) !important;
}

.plan-feature-card > strong {
    padding-bottom: 8px;
    color: var(--midnight-900);
    font-size: 14px;
    line-height: 14px;
}

.plan-feature-card span {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--midnight-900);
    font-size: 12px;
    line-height: 12px;
}

.next-payment {
    display: flex;
    justify-content: space-between;
    padding: 24px;
    border-radius: 8px;
    background: var(--paper-white);
    color: var(--midnight-900);
}

.next-payment {
    font-size: 12px;
    line-height: 12px;
}

.next-payment strong {
    font-size: 14px;
    line-height: 21px;
}

.settings-table {
    min-width: 760px;
}

.setting-filter-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.subject-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
}

.subject-toolbar .ledger-search-field {
    flex: 0 0 240px;
}

.subject-toolbar .ledger-search {
    width: 240px;
    min-width: 240px;
}

.subject-auto-button {
    margin-left: auto;
}

.subject-matrix {
    display: grid;
    grid-template-columns: minmax(310px, 0.85fr) minmax(360px, 1fr) minmax(310px, 0.85fr);
    gap: 80px;
    align-items: start;
}

.subject-panel {
    min-width: 0;
}

.subject-header {
    display: grid;
    grid-template-columns: 80px 140px minmax(120px, 1fr);
    height: 28px;
    border-bottom: 1px solid var(--classic-blue);
    color: var(--classic-blue);
    font-size: 11px;
    font-weight: 700;
}

.subject-header span {
    display: flex;
    align-items: center;
    padding: 0 6px;
}

.subject-group,
.subject-primary-row {
    display: grid;
    grid-template-columns: 80px minmax(0, 1fr);
    align-items: stretch;
}

.subject-group-name,
.subject-primary,
.subject-cell,
.subject-add-row {
    min-height: 41px;
    border-right: 1px solid var(--pale-light-gray);
    border-bottom: 1px solid var(--pale-light-gray);
    color: var(--deep-black);
    font-size: 14px;
    line-height: 21px;
}

.subject-group-name {
    padding: 10px 6px;
    border-left: 1px solid var(--pale-light-gray);
}

.subject-primary-list,
.subject-secondary-list {
    display: grid;
    min-width: 0;
}

.subject-primary-row {
    grid-template-columns: 140px minmax(0, 1fr);
}

.subject-primary,
.subject-cell {
    display: flex;
    align-items: center;
    padding: 0 6px;
}

.subject-cell {
    justify-content: flex-start;
}

.subject-add-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 6px;
    padding: 5px 6px;
}

.subject-add-row input {
    width: 100%;
    height: 28px;
    border: 1px solid var(--pale-gray);
    border-radius: 2px;
    background: var(--pure-white);
    color: var(--deep-black);
    padding: 0 8px;
    font-size: 12px;
}

.subject-add-row button {
    border: 0;
    background: transparent;
    color: var(--classic-blue);
    cursor: pointer;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}

.subject-panel.tax .subject-group {
    grid-template-columns: 90px minmax(0, 1fr);
}

.subject-panel.tax .subject-header {
    grid-template-columns: 90px 140px minmax(120px, 1fr);
}

.subject-panel.tax .subject-primary-row {
    grid-template-columns: 140px minmax(0, 1fr);
}

.subject-panel.statistics .subject-group {
    grid-template-columns: 100px minmax(0, 1fr);
}

.subject-panel.statistics .subject-header {
    grid-template-columns: 100px 140px minmax(120px, 1fr);
}

.subject-panel.statistics .subject-primary-row {
    grid-template-columns: 140px minmax(0, 1fr);
}

.setting-link-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 12px;
}

.setting-link-grid article {
    display: grid;
    gap: 8px;
    min-height: 110px;
    padding: 16px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 8px;
    background: var(--paper-white);
    color: var(--midnight-800);
}

.setting-link-grid strong {
    color: var(--deep-black);
}

.setting-link-grid span {
    color: var(--gray);
    font-size: 12px;
}

.setting-account-list {
    display: grid;
    gap: 10px;
}

.setting-account-list article {
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    min-height: 56px;
    padding: 10px 0;
    border-bottom: 1px solid var(--pale-light-gray);
}

.setting-account-list strong {
    display: block;
    color: var(--midnight-900);
}

.setting-account-list span {
    color: var(--gray);
    font-size: 12px;
}

.setting-toggle-list {
    display: grid;
    gap: 14px;
}

.setting-toggle-list label {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--midnight-900);
    font-weight: 600;
}


.btn-outline.danger {
    width: fit-content;
    border-color: var(--deep-rose);
    color: var(--deep-rose);
}

.register-page {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 24px;
    min-height: 100vh;
    padding: 48px 20px;
    background: var(--paper-white);
}

.register-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 40px;
    width: min(700px, 100%);
    min-height: 800px;
    padding: 50px 100px;
    border-radius: 8px;
    background: var(--pure-white);
    box-shadow: var(--shadow-100);
}

.register-card .btn-large {
    width: 100%;
}

.register-heading {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 40px;
}

.register-heading h1 {
    color: var(--midnight-800);
    font-family: var(--font-serif);
    font-size: 30px;
    line-height: 1.5;
}

.profile-select {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 32px;
    width: 100%;
}

.profile-copy {
    display: grid;
    gap: 32px;
    padding-bottom: 32px;
    border-bottom: 1px solid var(--pale-light-gray);
}

.profile-copy h2 {
    color: var(--midnight-800);
    font-family: var(--font-serif);
    font-size: 18px;
    line-height: 18px;
}

.profile-copy p {
    color: var(--midnight-800);
    font-size: 14px;
    font-weight: 500;
    line-height: 14px;
}

.profile-options {
    display: grid;
    gap: 16px;
}

.profile-option {
    display: grid;
    grid-template-columns: 20px auto 1fr;
    align-items: center;
    gap: 8px;
    color: var(--midnight-800);
}

.profile-option input {
    width: 20px;
    height: 20px;
}

.profile-option strong {
    font-size: 14px;
    line-height: 21px;
}

.profile-option input:checked + strong {
    border-bottom: 1px solid var(--midnight-800);
    font-weight: 600;
}

.profile-option span {
    color: #7292c9;
    font-size: 14px;
}

.notice-box,
.field-help {
    display: flex;
    gap: 8px;
    border-radius: 8px;
    background: #f7f9fc;
    color: var(--midnight-900);
}

.notice-box {
    align-items: flex-start;
    padding: 8px 16px;
}

.notice-box p {
    color: var(--midnight-900);
    font-size: 12px;
    line-height: 18px;
}

.register-form-section {
    display: grid;
    gap: 16px;
    width: 100%;
}

.form-row {
    display: grid;
    grid-template-columns: 150px minmax(0, 1fr);
    align-items: start;
    gap: 0;
    min-height: 36px;
}

.form-row > label,
.form-row > span,
.form-row > label:first-child {
    color: var(--dark-gray);
}

.form-row > label,
.form-row > span,
.form-row > :first-child {
    display: flex;
    align-items: center;
    min-height: 36px;
    padding-inline: 10px;
    color: var(--dark-gray);
    font-size: 14px;
}

.form-row input,
.form-row select {
    width: 100%;
}

.form-row input::placeholder {
    color: var(--mid-gray);
}

.field-help {
    align-items: center;
    width: 100%;
    margin-top: 8px;
    padding: 8px 12px;
    font-size: 12px;
}

.department-row > div {
    display: grid;
    justify-items: end;
}

.form-divider {
    height: 1px;
    background: var(--pale-light-gray);
}

.terms-list {
    display: grid;
    gap: 8px;
    padding-top: 0;
    padding-left: 150px;
    color: var(--midnight-800);
    font-size: 14px;
}

.terms-list label {
    display: flex;
    align-items: center;
    gap: 8px;
}

.terms-list input {
    width: 20px;
    height: 20px;
}

.terms-list a {
    margin-left: 8px;
    font-size: 12px;
    font-weight: 600;
}

.register-next {
    background: var(--midnight-800);
    border-color: var(--midnight-800);
}

.register-footer {
    color: var(--mid-gray);
    font-size: 10px;
    font-weight: 500;
}

.switcher-page {
    /* Keep the workspace page aligned with the dashboard's full content width. */
    max-width: none;
}

.switcher-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
    margin-bottom: 24px;
}

.switcher-summary article {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 4px 12px;
    align-items: center;
    min-height: 88px;
    padding: 18px;
    border: 1px solid var(--pale-light-gray);
    border-radius: 8px;
    background: var(--pure-white);
}

.switcher-summary span {
    grid-row: span 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 20px;
    background: #f7f9fc;
    color: var(--midnight-800);
}

.switcher-summary strong {
    color: var(--midnight-900);
    font-size: 18px;
    line-height: 24px;
}

.switcher-summary p {
    color: var(--gray);
    font-size: 12px;
}

.workspace-switch-list {
    display: grid;
    margin-top: 20px;
}

.workspace-switch-row {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) auto;
    gap: 16px;
    align-items: center;
    min-height: 76px;
    padding: 12px 0;
    border-bottom: 1px solid var(--pale-light-gray);
}

.workspace-switch-row:last-child {
    border-bottom: 0;
}

.workspace-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 24px;
    background: var(--hospital-sky);
    color: var(--pure-white);
}

.workspace-switch-copy,
.workspace-switch-stats {
    display: grid;
    gap: 6px;
}

.workspace-switch-copy strong,
.workspace-switch-stats b {
    color: var(--deep-black);
    font-size: 14px;
    line-height: 21px;
}

.workspace-switch-copy small,
.workspace-switch-stats small {
    color: var(--gray);
    font-size: 12px;
}

.workspace-switch-stats {
    text-align: right;
}

#blazor-error-ui {
    color-scheme: light only;
    display: none;
    position: fixed;
    right: 16px;
    bottom: 16px;
    z-index: 1000;
    padding: 12px 16px;
    border-radius: 8px;
    background: #fff4d6;
    color: var(--deep-black);
    box-shadow: 0 12px 32px rgba(12, 27, 84, 0.12);
}

#blazor-error-ui .dismiss {
    cursor: pointer;
    margin-left: 12px;
}

input:not([type="checkbox"]):not([type="radio"]),
textarea {
    border: 1px solid var(--pale-gray);
    border-radius: 2px;
    background: var(--pure-white);
    color: var(--midnight-900);
    font-feature-settings: "lnum" 1, "tnum" 1;
    font-weight: 400;
    letter-spacing: 0;
    transition: background-color 120ms ease, border-color 120ms ease, box-shadow 120ms ease;
}

input:not([type="checkbox"]):not([type="radio"])::placeholder,
textarea::placeholder {
    color: var(--mid-gray);
    opacity: 1;
}

input:not([type="checkbox"]):not([type="radio"]):hover:not(:disabled):not([readonly]),
select:hover:not(:disabled),
textarea:hover:not(:disabled):not([readonly]) {
    border-color: var(--mid-gray);
    background-color: #f9fbfd;
}

input:not([type="checkbox"]):not([type="radio"]):focus,
select:focus,
textarea:focus {
    border-color: var(--midnight-900);
    outline: none;
}

input:not([type="checkbox"]):not([type="radio"]):disabled,
select:disabled,
textarea:disabled {
    color: var(--mid-gray);
    cursor: not-allowed;
}

input:not([type="checkbox"]):not([type="radio"])[readonly],
textarea[readonly] {
    border-width: 0 0 1px;
    border-color: var(--pale-light-gray);
    border-radius: 0;
    background: var(--pure-white);
    color: var(--midnight-900);
}

.field input {
    height: 48px;
    padding: 0 12px;
    font-size: 16px;
    line-height: 24px;
}

.filter-input,
.modal-form-grid input:not(.input-large):not(.input-medium):not(.input-small),
.modal-form-grid select,
.settings-form input:not(.input-large):not(.input-medium):not(.input-small),
.settings-form select,
.form-row input:not(.input-large):not(.input-medium):not(.input-small),
.form-row select {
    height: 36px;
    padding: 0 10px;
    font-size: 14px;
    line-height: 21px;
}

/* Selects share one visual treatment; size classes only change their metrics. */
select {
    appearance: none;
    border: 1px solid var(--pale-gray);
    border-radius: 2px;
    background-color: var(--pure-white);
    background-image: url("icons/arrow-down-open.svg");
    background-position: right 5px center;
    background-repeat: no-repeat;
    background-size: 20px 20px;
    color: var(--midnight-900);
    cursor: pointer;
    font-feature-settings: "lnum" 1, "tnum" 1;
    font-weight: 400;
    letter-spacing: 0;
    padding-right: 30px;
    transition: background-color 120ms ease, border-color 120ms ease, box-shadow 120ms ease;
}

.select,
.select-medium {
    height: 36px;
    padding: 0 30px 0 10px;
    background-position: right 5px center;
    background-size: 20px 20px;
    font-size: 14px;
    line-height: 21px;
}

.select-small {
    height: 28px;
    padding: 0 24px 0 8px;
    background-position: right 4px center;
    background-size: 16px 16px;
    font-size: 12px;
    line-height: 18px;
}

.dr-select {
    position: relative;
    width: 100%;
    height: auto;
    padding: 0;
}

.dr-select-trigger {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    border: 1px solid var(--pale-gray);
    border-radius: 2px;
    background: var(--pure-white);
    color: var(--midnight-900);
    font-weight: 400;
    text-align: left;
}

.dr-select-trigger img {
    flex: 0 0 auto;
}

.dr-select.select-medium .dr-select-trigger {
    height: 36px;
    padding: 0 5px 0 10px;
    font-size: 14px;
    line-height: 21px;
}

.dr-select.select-medium .dr-select-trigger img {
    width: 20px;
    height: 20px;
}

.dr-select.select-small .dr-select-trigger {
    height: 28px;
    padding: 0 4px 0 8px;
    font-size: 12px;
    line-height: 18px;
}

.dr-select.select-small .dr-select-trigger img {
    width: 16px;
    height: 16px;
}

.dr-select-trigger[aria-expanded="true"] {
    border-color: var(--midnight-900);
    background: var(--midnight-15);
}

.dr-select-list {
    position: absolute;
    z-index: 20;
    top: calc(100% + 8px);
    left: 0;
    display: flex;
    overflow: hidden;
    flex-direction: column;
    width: 100%;
    border: 1px solid var(--pale-light-gray);
    border-radius: 2px;
    background: var(--pure-white);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.dr-select-option {
    width: 100%;
    border: 0;
    border-radius: 0;
    background: var(--pure-white);
    color: var(--midnight-900);
    font-weight: 400;
    text-align: left;
}

.dr-select-option + .dr-select-option {
    border-top: 1px solid var(--midnight-25);
}

.dr-select-option:hover,
.dr-select-option.selected {
    background: var(--midnight-25);
}

.dr-select.select-medium .dr-select-option {
    padding: 16px;
    font-size: 14px;
    line-height: 21px;
}

.dr-select.select-small .dr-select-option {
    padding: 12px;
    font-size: 12px;
    line-height: 18px;
}

.subject-add-row input {
    height: 28px;
    padding: 0 8px;
    font-size: 12px;
    line-height: 18px;
}

.setting-textarea {
    padding: 10px 12px;
    font-size: 14px;
    line-height: 21px;
}

@media (max-width: 1100px) {
    .app-shell {
        grid-template-columns: 104px minmax(0, 1fr);
    }

    .sidebar {
        position: sticky;
        z-index: 1000;
        top: 0;
        width: 104px;
        height: 100vh;
        padding: 16px 12px;
        gap: 12px;
        align-items: center;
        overflow: visible;
    }

    .sidebar .doctor-card {
        display: flex;
        align-items: center;
    }

    .sidebar .doctor-copy,
    .sidebar .segmented,
    .sidebar .btn-large span,
    .sidebar .btn-small span,
    .sidebar .nav-list span,
    .sidebar .nav-section a,
    .sidebar .nav-action-icon,
    .sidebar .sidebar-footer span,
    .sidebar .sidebar-footer strong {
        display: none;
    }

    .sidebar .avatar-wrap,
    .sidebar .brand-mark {
        width: 36px;
        height: 36px;
    }

    .sidebar .btn-large,
    .sidebar .nav-list a,
    .sidebar .nav-section-title,
    .sidebar .sidebar-footer a {
        width: 100%;
        min-height: 36px;
        padding: 0;
        justify-content: center;
    }

    .sidebar .nav-list {
        width: 100%;
        align-items: center;
        overflow: visible;
    }

    .sidebar .nav-section {
        position: relative;
        width: 100%;
        justify-items: center;
        padding: 6px 0;
    }

    .sidebar .sidebar-footer {
        align-items: center;
    }

    /* Hide favorites section on mobile */
    .sidebar .nav-section:first-of-type {
        display: none;
    }

    /* Hide expand/collapse icons on mobile */
    .sidebar .nav-section-title .nav-action-icon {
        display: none;
    }

    .sidebar .nav-submenu {
        display: flex;
        flex-direction: column;
        position: absolute;
        z-index: 1001;
        top: 0;
        left: calc(100% + 2px);
        width: 208px;
        padding: 8px;
        border-radius: 8px;
        background: var(--paper-white);
        box-shadow: 8px 8px 20px rgba(15, 35, 67, 0.14);
    }

    .sidebar .nav-section:not(.expanded) .nav-submenu {
        display: none;
    }

    .sidebar .nav-submenu .nav-item-row {
        display: flex;
        align-items: center;
        gap: 6px;
        width: 100%;
        min-height: 38px;
        padding: 1px 0;
        border-radius: 2px;
        background: transparent;
        font-size: 14px;
    }

    .sidebar .nav-section.expanded .nav-section-title {
        background: var(--pure-white);
        color: var(--deep-black);
    }

    .sidebar .nav-section.expanded .nav-section-title .nav-icon {
        filter: brightness(0) saturate(100%) invert(0%) sepia(7%) saturate(5658%) hue-rotate(113deg) brightness(135%) contrast(80%);
    }

    .sidebar .nav-item-row a {
        display: flex;
        min-height: 36px;
        padding: 0 10px 0 36px;
        flex: 1;
        color: var(--gray);
        justify-content: flex-start;
    }

    .sidebar .nav-item-row .nav-favorite-toggle {
        display: none;
    }

    .metric-grid,
    .dashboard-metrics,
    .dashboard-split,
    .switcher-summary,
    .section-grid.two,
    .account-trend-layout,
    .assignment-grid,
    .state-grid,
    .login-page,
    .surface-portal,
    .source-ledger-stage,
    .source-ledger-stage.is-detail-open,
    .source-ledger-metrics,
    .ledger-form-metrics,
    .card-form-metrics,
    .source-ledger-detail-strip dl {
        grid-template-columns: 1fr;
    }

    .source-ledger-detail-strip {
        align-items: stretch;
        flex-direction: column;
    }

    .register-card {
        padding: 42px 48px;
    }

    .login-hero {
        display: none;
    }
    
}

@media (max-width: 1280px) {
    .collection-review-layout {
        grid-template-columns: 210px minmax(0, 1fr);
    }

    .ledger-toolbar:not(.secondary) {
        flex-wrap: wrap;
    }

    .card-holder-form {
        grid-template-columns: repeat(2, minmax(160px, 1fr));
    }

    .card-holder-form .btn-primary {
        justify-self: start;
    }

    .cash-flow-account-summary-card {
        grid-template-columns: 1fr;
    }
    
}

@media (max-width: 900px) {
    .collection-review-layout {
        grid-template-columns: 1fr;
    }

    .collection-group-nav {
        position: static;
    }

    .collection-group-list {
        grid-auto-flow: column;
        grid-auto-columns: minmax(170px, 1fr);
        grid-template-columns: none;
        max-height: none;
        overflow-x: auto;
        overflow-y: hidden;
        padding-bottom: 10px;
    }
}

@media (max-width: 720px) {
    .app-shell {
        grid-template-columns: 72px minmax(0, 1fr);
    }

    .sidebar {
        width: 72px;
        padding: 12px 8px;
    }

    .workspace,
    .login-page,
    .register-page {
        padding: 20px 16px;
    }

    .metric-grid,
    .dashboard-metrics,
    .dashboard-split,
    .tax-card-grid,
    .switcher-summary,
    .source-ledger-stage,
    .source-ledger-stage.is-detail-open,
    .source-ledger-metrics,
    .ledger-form-metrics,
    .card-form-metrics,
    .source-ledger-detail-strip dl {
        grid-template-columns: 1fr;
    }

    .supplementary-toast {
        top: 12px;
        right: 12px;
        max-width: calc(100vw - 24px);
    }

    .ledger-form-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .card-management-tabs {
        overflow-x: auto;
        flex-wrap: nowrap;
        scrollbar-width: thin;
    }

    .card-management-tabs .card-tab-year-filter {
        width: 100%;
        margin-left: 0;
        padding: 8px 0 0;
    }

    .classification-tabs.card-management-tabs button {
        min-width: max-content;
    }

    .card-management-overview {
        padding: 16px 12px;
    }

    .card-scroll-hint {
        display: block;
    }

    .card-matrix-wrap {
        background:
            linear-gradient(to right, var(--pure-white) 30%, transparent),
            linear-gradient(to left, var(--pure-white) 30%, transparent),
            linear-gradient(to right, rgba(19, 42, 77, .14), transparent 70%),
            linear-gradient(to left, rgba(19, 42, 77, .14), transparent 70%);
        background-attachment: local, local, scroll, scroll;
        background-position: left center, right center, left center, right center;
        background-repeat: no-repeat;
        background-size: 40px 100%, 40px 100%, 12px 100%, 12px 100%;
    }

    .card-summary-matrix th:first-child,
    .card-summary-matrix td:first-child {
        position: sticky;
        left: 0;
        z-index: 2;
        background: var(--pure-white);
        box-shadow: 1px 0 0 var(--pale-light-gray);
    }

    .card-summary-matrix thead th:first-child,
    .card-summary-matrix tfoot th:first-child {
        z-index: 3;
        background: #f4f7fc;
    }

    .card-user-account-groups .workspace-list {
        gap: 10px;
    }

    .card-user-account-groups .card-account-list-item {
        border-bottom-color: transparent;
        padding: 12px 0;
    }

    .card-holder-form,
    .card-holder-history-list article {
        grid-template-columns: 1fr;
    }

    .card-assignment-modal-backdrop {
        padding: 12px;
    }

    .figma-modal.card-assignment-modal {
        padding: 18px 16px;
    }

    .card-assignment-modal .card-holder-form {
        grid-template-columns: 1fr;
    }

    .card-assignment-modal .card-holder-memo-field {
        grid-column: auto;
    }

    .card-assignment-modal .card-holder-form .btn-primary {
        justify-self: start;
    }

    .cash-flow-account-summary-card dl {
        grid-template-columns: repeat(2, minmax(110px, 1fr));
    }

    .topbar,
    .dashboard-topbar,
    .panel-header,
    .workspace-row,
    .workspace-switch-row,
    .bar-row,
    .filter-group {
        align-items: stretch;
        grid-template-columns: 1fr;
        flex-direction: column;
    }

    .period-filter {
        max-width: 100%;
        justify-content: flex-start;
        overflow-x: auto;
    }

    .period-range-tool {
        display: flex;
        min-width: 0;
        width: 100%;
    }

    .period-range-tool .period-filter {
        flex: 1 1 auto;
    }

    .account-trend-layout {
        grid-template-columns: 1fr;
    }

    .account-trend-bar-row {
        grid-template-columns: 64px minmax(90px, 1fr);
    }

    .classification-modal .classification-preview-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .batch-assign-summary,
    .batch-assign-preview-list div {
        grid-template-columns: 1fr;
    }

    .classification-modal {
        padding: 20px;
    }

    .selection-edit-modal .selection-edit-footer {
        bottom: -20px;
        align-items: stretch;
        flex-direction: column-reverse;
        margin: 0 -20px -20px;
        padding: 14px 20px 20px;
    }

    .selection-edit-modal .selection-edit-footer .btn-medium {
        width: 100%;
    }

    .subject-drop-panel {
        top: 16px;
        right: 8px;
        bottom: auto;
        left: 8px;
        width: auto;
        max-height: calc(100vh - 32px);
    }

    .classification-ledger-layout {
        grid-template-columns: minmax(0, 1fr);
    }

    .classification-ledger-main {
        grid-column: 1;
        grid-row: auto;
    }

    .subject-drop-panel.docked {
        grid-column: 1;
        grid-row: auto;
        position: static;
        width: 100%;
        max-height: 70vh;
        order: -1;
    }

    .subject-drop-tools {
        grid-template-columns: 1fr;
    }

    .subject-drop-tools .select-small {
        width: 100%;
        max-width: none;
    }

    .account-trend-bar-row strong {
        grid-column: 2;
    }

    .dashboard-panel,
    .panel,
    .dashboard-card,
    .register-card {
        padding: 18px;
    }

    .source-ledger-head,
    .source-ledger-card-foot,
    .source-ledger-row,
    .source-ledger-row-meta,
    .source-ledger-detail-strip {
        align-items: stretch;
        grid-template-columns: 1fr;
        flex-direction: column;
    }

    .source-ledger-row-meta,
    .source-ledger-stage.is-detail-open .source-ledger-row-meta {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        justify-content: stretch;
    }

    .month-chart {
        overflow-x: auto;
        grid-template-columns: repeat(6, 54px);
        padding-inline: 12px;
    }

    .form-row,
    .profile-option {
        grid-template-columns: 1fr;
    }

    .terms-list {
        padding-left: 0;
    }

    .workspace-switch-stats {
        text-align: left;
    }

    .filter-input {
        width: 100%;
        min-width: 0;
    }

    .ledger-search-field {
        flex-basis: 100%;
        max-width: none;
    }

}

/* Figma Search: the border belongs to the control, with the icon inside it. */
.search-input-shell .search-input-control .search-input-field,
.search-input-shell .search-input-control .search-input-field:hover,
.search-input-shell .search-input-control .search-input-field:focus {
    width: auto;
    height: 100%;
    min-height: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    outline: 0;
    background: transparent;
    box-shadow: none;
}

.search-input-shell .search-input-control > .search-icon,
.search-input-shell .search-input-control > .search-input-clear {
    position: static;
    top: auto;
    right: auto;
    left: auto;
    flex: 0 0 auto;
    transform: none;
}

/* Textareas use the same field tokens while preserving multiline height and inner spacing. */
textarea,
.field textarea {
    box-sizing: border-box;
    width: 100%;
    height: auto;
    min-height: 84px;
    padding: 10px 12px;
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: 400;
    line-height: 21px;
    letter-spacing: 0;
    color: var(--midnight-900);
    resize: vertical;
}

textarea.input-small,
.field.field-small textarea {
    height: auto;
    min-height: 72px;
    padding: 8px 10px;
    font-size: 12px;
    line-height: 18px;
}

textarea.input-medium,
.field.field-medium textarea {
    height: auto;
    min-height: 84px;
    padding: 10px 12px;
    font-size: 14px;
    line-height: 21px;
}

textarea.input-large,
.field.field-large textarea {
    height: auto;
    min-height: 112px;
    padding: 12px 14px;
    font-size: 16px;
    line-height: 24px;
}

/* Source ledger descriptions only need a component-specific minimum height. */
.source-ledger-edit-modal .source-ledger-description {
    min-height: 84px;
}

/* Shared modal design-system alignment. */
.figma-modal {
    box-sizing: border-box;
}

.figma-modal > .modal-header,
.figma-modal > .modal-body,
.figma-modal > .modal-footer,
.figma-modal > .modal-form-grid {
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}

.figma-modal input:not([type="checkbox"]):not([type="radio"]),
.figma-modal select,
.figma-modal textarea {
    box-sizing: border-box;
    max-width: 100%;
}

.figma-modal > .modal-footer {
    justify-content: space-between;
    align-items: center;
}

.figma-modal > .modal-footer > .btn-medium {
    width: 150px;
    justify-content: center;
}

.figma-modal .modal-close-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 24px;
    width: 24px;
    height: 24px;
    padding: 0;
    border: 1px solid transparent;
    border-radius: 2px;
    color: var(--midnight-900);
    background: transparent;
}

.figma-modal .modal-close-button:hover:not(:disabled) {
    border-color: var(--pale-gray);
    background: #f9fbfd;
}

.selection-edit-modal .modal-header .modal-close-button {
    width: 24px;
    height: 24px;
}

.source-ledger-edit-modal .modal-body,
.source-ledger-edit-modal .modal-form-grid,
.source-ledger-edit-modal .source-ledger-edit-original,
.source-ledger-edit-modal .field {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}