:root {
    --bg: #f5f7f8;
    --panel: #ffffff;
    --line: #d8dee4;
    --line-strong: #b8c1cc;
    --text: #1c2733;
    --muted: #647386;
    --accent: #1f6f78;
    --accent-soft: #e4f3f2;
    --warn: #9a5a00;
    --warn-bg: #fff4d8;
    --danger: #9d2f2f;
    --nav: #22313b;
    --nav-muted: #aebac3;
    --green: #2d6a4f;
}

* {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    min-height: 100%;
    font-family: "Segoe UI", Arial, sans-serif;
    color: var(--text);
    background: var(--bg);
}

button,
input,
select,
textarea {
    font: inherit;
}

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

.sidebar {
    background: var(--nav);
    color: #fff;
    padding: 20px 14px;
}

.brand {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0 8px 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.16);
}

.brand-mark {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border: 1px solid rgba(255, 255, 255, 0.28);
    background: rgba(255, 255, 255, 0.08);
    font-weight: 700;
}

.brand-title {
    font-size: 16px;
    font-weight: 700;
}

.brand-subtitle {
    color: var(--nav-muted);
    font-size: 13px;
}

.report-nav {
    display: grid;
    gap: 4px;
    margin-top: 18px;
}

.tool-nav {
    display: grid;
    gap: 4px;
    margin-top: 18px;
    padding-top: 14px;
    border-top: 1px solid rgba(255, 255, 255, 0.14);
}

.nav-section-label {
    padding: 0 10px 4px;
    color: var(--nav-muted);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0;
    text-transform: uppercase;
}

.nav-item {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 40px;
    border: 0;
    padding: 0 10px;
    color: var(--nav-muted);
    background: transparent;
    cursor: pointer;
    text-align: left;
}

.nav-item svg {
    width: 18px;
    height: 18px;
}

.nav-item.active {
    color: #fff;
    background: rgba(255, 255, 255, 0.12);
}

.nav-item.inactive {
    opacity: 0.55;
    cursor: default;
}

.report-option-popover {
    position: fixed;
    z-index: 30;
    display: none;
    min-width: 150px;
    border: 1px solid var(--line);
    background: #fff;
    box-shadow: 0 12px 28px rgba(25, 37, 49, 0.18);
    padding: 6px;
}

.report-option-popover.open {
    display: grid;
    gap: 4px;
}

.report-option-popover button {
    min-height: 34px;
    border: 0;
    background: transparent;
    color: var(--text);
    padding: 0 10px;
    text-align: left;
    cursor: pointer;
}

.report-option-popover button:hover {
    background: var(--accent-soft);
}

.workspace {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.topbar {
    position: sticky;
    top: 0;
    z-index: 5;
    display: grid;
    grid-template-columns: minmax(280px, 520px) minmax(520px, 1fr) auto;
    align-items: end;
    gap: 16px;
    padding: 14px 20px;
    border-bottom: 1px solid var(--line);
    background: rgba(245, 247, 248, 0.96);
}

label {
    display: block;
    color: var(--muted);
    font-size: 12px;
    margin-bottom: 5px;
}

.combo {
    display: flex;
    align-items: center;
    gap: 8px;
    height: 38px;
    border: 1px solid var(--line);
    background: #fff;
    padding: 0 10px;
}

.combo svg {
    color: var(--muted);
    width: 18px;
    height: 18px;
}

.combo input {
    width: 100%;
    border: 0;
    outline: 0;
}

.association-picker {
    position: relative;
}

.combo-results {
    position: absolute;
    top: 63px;
    left: 0;
    right: 0;
    max-height: 320px;
    overflow: auto;
    border: 1px solid var(--line);
    background: #fff;
    box-shadow: 0 10px 30px rgba(17, 24, 39, 0.12);
    display: none;
    z-index: 20;
}

.combo-results.open {
    display: block;
}

.combo-result {
    width: 100%;
    border: 0;
    padding: 9px 12px;
    background: #fff;
    text-align: left;
    cursor: pointer;
}

.combo-result:hover {
    background: var(--accent-soft);
}

.date-controls {
    display: grid;
    grid-template-columns: auto 150px auto 150px auto 150px 38px;
    align-items: end;
    gap: 8px;
}

.date-controls input {
    height: 38px;
    border: 1px solid var(--line);
    background: #fff;
    padding: 0 8px;
}

.icon-button,
.tool-button,
.source-option {
    border: 1px solid var(--line);
    background: #fff;
    color: var(--text);
    cursor: pointer;
}

.icon-button {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
}

.icon-button svg,
.tool-button svg {
    width: 17px;
    height: 17px;
}

.source-toggle {
    display: flex;
    border: 1px solid var(--line);
    background: #fff;
}

.source-option {
    height: 38px;
    border: 0;
    padding: 0 12px;
}

.source-option.active {
    background: var(--accent);
    color: #fff;
}

.diagnostics {
    margin: 16px 20px 0;
    border: 1px solid #e6c66f;
    background: var(--warn-bg);
    color: var(--warn);
    padding: 10px 12px;
}

.hidden {
    display: none;
}

.report-switcher {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 16px 20px 0;
}

.report-tab {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 36px;
    border: 1px solid var(--line);
    background: #fff;
    color: var(--text);
    padding: 0 12px;
    cursor: pointer;
}

.report-tab svg {
    width: 16px;
    height: 16px;
}

.report-tab.active {
    border-color: var(--accent);
    background: var(--accent-soft);
    color: var(--accent);
    font-weight: 650;
}

.report-tab.selected {
    border-color: #6f8f4e;
    background: #edf5e8;
    color: #37591f;
    box-shadow: inset 0 0 0 1px rgba(55, 89, 31, 0.18);
}

.tool-switcher {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    padding: 8px 20px 0;
}

.tool-switcher-label {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0;
    margin-right: 2px;
    text-transform: uppercase;
}

.tool-tab {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 32px;
    border: 1px solid var(--line);
    background: #fff;
    color: var(--text);
    padding: 0 10px;
    cursor: pointer;
    font-size: 13px;
}

.tool-tab svg {
    width: 15px;
    height: 15px;
}

.tool-tab.active {
    border-color: var(--accent);
    background: var(--accent-soft);
    color: var(--accent);
    font-weight: 650;
}

.report-set-actions {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    margin-left: auto;
    padding-left: 8px;
}

.report-set-actions .icon-button {
    width: 34px;
    height: 34px;
}

.report-set-preset-popover {
    position: fixed;
    z-index: 70;
    display: none;
    width: min(360px, calc(100vw - 16px));
    border: 1px solid var(--line-strong);
    background: #fff;
    box-shadow: 0 12px 32px rgba(28, 39, 49, 0.16);
}

.report-set-preset-popover.open {
    display: grid;
}

.report-set-preset-popover button {
    display: grid;
    gap: 3px;
    border: 0;
    border-bottom: 1px solid var(--line);
    background: #fff;
    color: var(--text);
    padding: 10px 12px;
    text-align: left;
    cursor: pointer;
}

.report-set-preset-popover button:last-child {
    border-bottom: 0;
}

.report-set-preset-popover button:hover {
    background: #f4f8f8;
}

.report-set-preset-popover span {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.35;
}

.report-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    padding: 22px 20px 12px;
}

h1,
h2,
p {
    margin: 0;
}

h1 {
    font-size: 24px;
    line-height: 1.2;
}

.report-header p,
.drilldown-header p {
    margin-top: 4px;
    color: var(--muted);
}

.report-actions {
    display: flex;
    gap: 8px;
}

.tool-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 36px;
    padding: 0 12px;
}

.tool-button.danger {
    color: var(--danger);
}

.report-surface {
    width: calc(100% - 40px);
    margin: 0 auto 28px;
    overflow: auto;
    border: 1px solid var(--line);
    background: var(--panel);
}

.report-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 760px;
}

.report-table th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: #edf1f4;
    color: #354555;
    font-weight: 650;
    text-align: right;
    border-bottom: 1px solid var(--line-strong);
    padding: 9px 10px;
    white-space: nowrap;
}

.report-table th:first-child,
.report-table td:first-child {
    text-align: left;
}

.report-table td {
    border-bottom: 1px solid var(--line);
    padding: 8px 10px;
    text-align: right;
    white-space: nowrap;
}

.report-table th.text-left,
.report-table td.text-left {
    text-align: left;
}

.report-table th.text-right,
.report-table td.text-right {
    text-align: right;
}

.report-table th.text-left .sortable-header {
    justify-content: flex-start;
    text-align: left;
}

.report-table th.text-right .sortable-header {
    justify-content: flex-end;
    text-align: right;
}

body[data-active-report="balance"] .report-surface,
body[data-active-report="budget"] .report-surface,
body[data-active-report="receivables"] .report-surface,
body[data-active-report="payables"] .report-surface {
    max-width: 980px;
}

body[data-active-report="trialBalance"] .report-surface {
    max-width: 1120px;
}

body[data-active-report="ledger"] .report-surface {
    max-width: 1480px;
}

body[data-active-report="balance"] .report-table,
body[data-active-report="budget"] .report-table,
body[data-active-report="receivables"] .report-table,
body[data-active-report="payables"] .report-table,
body[data-active-report="trialBalance"] .report-table {
    min-width: 0;
}

.section-row td {
    background: #f7f9fa;
    color: #334;
    font-weight: 700;
}

.total-row td {
    border-top: 1px solid var(--line-strong);
    background: #f3f6f7;
    font-weight: 700;
}

.subtotal-row td {
    color: var(--muted);
    font-style: italic;
    border-bottom-color: transparent;
    padding-top: 4px;
}

.drillable {
    color: var(--accent);
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.drill-button {
    border: 0;
    background: transparent;
    padding: 0;
    font: inherit;
    text-align: inherit;
}

.drill-button:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 2px;
}

.cell-drill {
    display: inline-block;
    min-width: 100%;
}

.amount-negative {
    color: var(--danger);
}

.amount-warning {
    color: #6f5300;
}

.hidden-print-frame {
    position: fixed;
    width: 0;
    height: 0;
    border: 0;
    opacity: 0;
    pointer-events: none;
}

.drilldown-panel {
    position: fixed;
    top: 0;
    right: 0;
    z-index: 30;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    width: min(1280px, 96vw);
    height: 100vh;
    background: #fff;
    border-left: 1px solid var(--line);
    box-shadow: -18px 0 36px rgba(17, 24, 39, 0.18);
    transform: translateX(105%);
    transition: transform 160ms ease;
}

.drilldown-panel.open {
    transform: translateX(0);
}

.drilldown-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    border-bottom: 1px solid var(--line);
    padding: 18px;
}

.drilldown-header h2 {
    font-size: 20px;
}

.drilldown-body {
    overflow: auto;
}

.subledger-summary,
.statement-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 18px;
    border-bottom: 1px solid var(--line);
    background: #f7f9fa;
}

.subledger-summary div {
    display: grid;
    gap: 3px;
}

.subledger-summary span,
.statement-balance span {
    color: var(--muted);
    font-size: 12px;
}

.subledger-summary strong,
.statement-balance strong {
    font-size: 18px;
}

.statement-heading h3 {
    margin: 0;
    font-size: 18px;
}

.statement-heading p {
    margin-top: 4px;
    color: var(--muted);
}

.statement-balance {
    display: grid;
    gap: 3px;
    min-width: 130px;
    text-align: right;
}

.statement-table th:first-child,
.statement-table td:first-child {
    width: 96px;
}

.status {
    padding: 28px;
    color: var(--muted);
}

.operations-shell {
    display: grid;
    gap: 14px;
    padding: 14px;
}

.operations-overview {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1px;
    border: 1px solid var(--line);
    background: var(--line);
}

.operations-overview div,
.operation-card {
    background: #fff;
}

.operations-overview div {
    display: grid;
    gap: 5px;
    padding: 14px;
}

.operations-overview span,
.operation-card p,
.operation-links span {
    color: var(--muted);
}

.operations-overview span {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
}

.operations-overview strong {
    font-size: 18px;
}

.operations-overview p,
.operation-card p {
    margin: 0;
    line-height: 1.4;
}

.operations-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.operation-card {
    display: grid;
    grid-template-rows: auto minmax(58px, auto) auto;
    gap: 10px;
    min-height: 190px;
    border: 1px solid var(--line);
    padding: 14px;
}

.operation-card.clickable {
    cursor: pointer;
}

.operation-card.clickable:hover {
    border-color: #9bc8c8;
    background: #fbfefe;
}

.operation-card header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.operation-card h2 {
    font-size: 17px;
}

.operation-status {
    flex: 0 0 auto;
    border: 1px solid var(--line);
    padding: 3px 7px;
    font-size: 12px;
    font-weight: 700;
}

.operation-status.ported {
    border-color: #bcd7ca;
    background: #e7f3ed;
    color: var(--green);
}

.operation-status.partial {
    border-color: #e6c66f;
    background: var(--warn-bg);
    color: var(--warn);
}

.operation-status.blocked {
    background: #f3f6f7;
    color: var(--muted);
}

.operation-links {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-self: end;
}

.operation-links button {
    min-height: 30px;
    border: 1px solid var(--line);
    background: #fff;
    color: var(--accent);
    padding: 0 9px;
    cursor: pointer;
}

.operation-links button:hover {
    background: var(--accent-soft);
}

body.legacy-info-mode {
    background: #fff;
    color: #333;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

body.legacy-info-mode .sidebar,
body.legacy-info-mode .topbar,
body.legacy-info-mode .report-switcher,
body.legacy-info-mode .report-header,
body.legacy-info-mode .diagnostics {
    display: none;
}

body.legacy-info-mode .app-shell,
body.legacy-info-mode .workspace {
    display: block;
    min-height: 100vh;
}

body.legacy-info-mode .report-surface {
    margin: 0;
    overflow: visible;
    border: 0;
    background: #fff;
}

.legacy-clone-shell {
    min-height: 100vh;
    background: #fff;
    padding-top: 116px;
}

.legacy-topbar {
    position: fixed;
    top: 0;
    right: 0;
    left: 160px;
    z-index: 20;
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-rows: 58px 58px;
    align-items: center;
    min-height: 116px;
    background: #222;
    color: #9d9d9d;
}

.legacy-brand {
    grid-column: 1 / 2;
    justify-self: center;
    color: #9d9d9d;
    font-size: 18px;
}

.legacy-user {
    display: flex;
    align-items: center;
    gap: 28px;
    padding-right: 18px;
    color: #9d9d9d;
}

.legacy-user button,
.legacy-main-nav button,
.legacy-actions button {
    border: 0;
    background: transparent;
    color: #9d9d9d;
    cursor: pointer;
    font: inherit;
}

.legacy-user button:hover,
.legacy-main-nav button:hover,
.legacy-actions button:hover,
.legacy-main-nav button.active {
    color: #fff;
}

.legacy-main-nav {
    grid-column: 1 / 2;
    display: flex;
    justify-content: center;
    gap: 34px;
}

.legacy-actions {
    display: flex;
    justify-content: flex-end;
    gap: 28px;
    padding-right: 18px;
}

.legacy-association-rail {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    z-index: 15;
    width: 160px;
    overflow-y: auto;
    background: #111;
    padding-top: 200px;
}

.legacy-association-rail button {
    display: block;
    width: 100%;
    min-height: 48px;
    border: 0;
    background: transparent;
    color: #337ab7;
    padding: 8px 15px;
    text-align: left;
    cursor: pointer;
    line-height: 1.35;
}

.legacy-association-rail button:hover,
.legacy-association-rail button.active {
    color: #fff;
    background: #222;
}

.legacy-content {
    margin-left: 160px;
    padding: 42px 20px 20px;
}

.legacy-info-port {
    width: calc(100vw - 200px);
    max-width: none;
    margin: 0;
    padding: 0;
}

.legacy-info-port .jumbotron {
    margin: 0 0 30px;
    background: #eeeeee;
    border-radius: 6px;
    padding: 48px 65px;
}

.legacy-info-port .jumbotron h2 {
    margin: 0 0 10px;
    color: #333;
    font-size: 30px;
    font-weight: 500;
    line-height: 1.1;
}

.legacy-map-link {
    border: 0;
    background: transparent;
    color: inherit;
    padding: 0;
    text-align: left;
    cursor: pointer;
}

.legacy-map-link:hover {
    text-decoration: underline;
}

.legacy-info-port strong {
    color: #000;
    font-weight: 700;
}

.legacy-info-table {
    width: min(1480px, calc(100vw - 240px));
    margin: 0 auto;
    border-collapse: collapse;
}

.legacy-info-table td {
    padding: 2px 0;
    vertical-align: middle;
}

.legacy-info-label {
    width: 360px;
    padding-right: 30px;
    text-align: right;
}

.legacy-info-control {
    width: auto;
}

.legacy-info-port .form-control {
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    border: 1px solid #ccc;
    border-radius: 4px;
    background: #fff;
    color: #555;
    font-size: 14px;
    line-height: 1.42857143;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}

.legacy-info-port textarea.form-control {
    min-height: 78px;
    height: auto;
}

.legacy-placeholder-panel {
    width: min(980px, calc(100vw - 240px));
    margin: 42px auto;
    border: 1px solid #ddd;
    background: #fff;
    padding: 28px;
}

.legacy-placeholder-panel h2 {
    margin: 0 0 12px;
    color: #333;
    font-size: 30px;
    font-weight: 500;
}

.legacy-placeholder-panel p {
    margin: 0 0 8px;
    color: #555;
}

.legacy-list-port {
    width: calc(100vw - 200px);
    max-width: none;
    margin: 0;
    padding: 0;
}

.legacy-list-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    width: min(1480px, calc(100vw - 240px));
    margin: 0 auto 12px;
}

.legacy-list-actions button {
    min-height: 34px;
    border: 1px solid #ccc;
    border-radius: 4px;
    background: #fff;
    color: #333;
    padding: 6px 12px;
    font-size: 14px;
    cursor: pointer;
}

.legacy-list-actions button:hover {
    background: #eee;
}

.legacy-grid-title {
    width: min(1480px, calc(100vw - 240px));
    margin: 26px auto 10px;
    color: #333;
    font-size: 26px;
    font-weight: 500;
}

.legacy-grid {
    width: min(1480px, calc(100vw - 240px));
    margin: 0 auto 18px;
    border-collapse: collapse;
    background: #fff;
    color: #333;
    font-size: 14px;
}

.legacy-grid th,
.legacy-grid td {
    border: 1px solid #ddd;
    padding: 8px;
    text-align: left;
    vertical-align: top;
}

.legacy-grid th {
    border-bottom-width: 2px;
    font-weight: 700;
}

.legacy-grid tbody tr:nth-child(odd) {
    background: #f9f9f9;
}

.legacy-grid tbody tr.draft-row {
    background: #fbfcfd;
}

.legacy-collapsible-panel {
    width: min(1480px, calc(100vw - 240px));
    margin: 24px auto 18px;
    border: 1px solid #ddd;
    background: #fff;
}

.legacy-collapsible-panel summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 46px;
    padding: 10px 14px;
    cursor: pointer;
    color: #333;
    font-size: 18px;
    font-weight: 500;
}

.legacy-collapsible-panel summary em {
    color: #777;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
}

.legacy-collapsible-body {
    border-top: 1px solid #ddd;
    padding: 12px 0;
}

.legacy-collapsible-body .legacy-grid,
.legacy-collapsible-body .legacy-list-actions {
    width: calc(100% - 24px);
}

.other-receivable-grid th:nth-child(1),
.other-receivable-grid td:nth-child(1) {
    width: 18%;
}

.other-receivable-grid th:nth-child(2),
.other-receivable-grid td:nth-child(2) {
    width: 24%;
}

.other-receivable-grid th:nth-child(5),
.other-receivable-grid td:nth-child(5) {
    width: 20%;
}

.recurring-vendor-grid th:nth-child(1),
.recurring-vendor-grid td:nth-child(1) {
    width: 24%;
}

.recurring-vendor-grid th:nth-child(2),
.recurring-vendor-grid td:nth-child(2) {
    width: 18%;
}

.recurring-vendor-grid th:nth-child(7),
.recurring-vendor-grid td:nth-child(7) {
    width: 20%;
}

.legacy-inline-input,
.legacy-inline-select,
.legacy-inline-textarea {
    width: 100%;
    border: 1px solid #ccc;
    border-radius: 3px;
    background: #fff;
    color: #333;
    padding: 5px 7px;
    font-size: 13px;
}

.legacy-inline-select {
    margin-top: 6px;
}

.legacy-inline-textarea {
    min-height: 58px;
    resize: vertical;
}

.legacy-inline-check {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    color: #333;
    font-size: 13px;
}

.recurring-vendor-row-actions {
    min-width: 132px;
}

.recurring-vendor-row-actions button {
    min-height: 28px;
    border: 1px solid #ccc;
    border-radius: 3px;
    background: #fff;
    color: #333;
    padding: 4px 8px;
    cursor: pointer;
}

.recurring-vendor-row-actions button:hover {
    background: #eee;
}

.recurring-vendor-save-state {
    display: block;
    margin-top: 6px;
    color: var(--muted);
    font-size: 12px;
}

.inactive-recurring-vendor {
    opacity: 0.68;
}

.recurring-vendor-row.saving {
    opacity: 0.75;
}

.port-placeholder {
    border: 1px solid var(--line);
    background: #fff;
    padding: 14px;
}

.port-placeholder p {
    color: var(--muted);
}

.port-placeholder {
    display: grid;
    gap: 10px;
    margin: 14px;
}

.port-placeholder h2 {
    font-size: 18px;
}

.dashboard-shell {
    display: grid;
    gap: 14px;
    padding: 14px;
}

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

.dashboard-tile,
.quick-action,
.dashboard-list-row {
    border: 1px solid var(--line);
    background: #fff;
    color: var(--text);
    cursor: pointer;
}

.dashboard-tile {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    gap: 4px 10px;
    min-height: 116px;
    padding: 14px;
    text-align: left;
}

.dashboard-tile svg,
.quick-action svg {
    width: 20px;
    height: 20px;
    color: var(--accent);
}

.dashboard-tile span {
    align-self: center;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
}

.dashboard-tile strong {
    grid-column: 1 / -1;
    font-size: 25px;
}

.dashboard-tile em {
    grid-column: 1 / -1;
    color: var(--muted);
    font-size: 12px;
    font-style: normal;
}

.dashboard-worklist {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.dashboard-worklist article,
.dashboard-actions,
.dashboard-note {
    border: 1px solid var(--line);
    background: #fff;
}

.dashboard-worklist header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 48px;
    padding: 10px 12px;
    border-bottom: 1px solid var(--line);
    background: #f7f9fa;
}

.dashboard-worklist h2 {
    font-size: 15px;
}

.dashboard-list {
    display: grid;
}

.dashboard-list-row {
    display: grid;
    grid-template-columns: minmax(58px, 0.35fr) minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    min-height: 46px;
    border-width: 0 0 1px;
    padding: 9px 12px;
    text-align: left;
}

.dashboard-list-row:last-child {
    border-bottom: 0;
}

.dashboard-list-row span,
.dashboard-list-row em {
    color: var(--muted);
    font-size: 12px;
    font-style: normal;
}

.dashboard-list-row strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-list-row em {
    color: var(--text);
    font-weight: 700;
}

.dashboard-actions {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1px;
    background: var(--line);
}

.quick-action {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 56px;
    border: 0;
    font-weight: 650;
}

.dashboard-note {
    padding: 12px;
    color: #344454;
}

.dashboard-tile:hover,
.quick-action:hover,
.dashboard-list-row:hover {
    background: var(--accent-soft);
}

.document-summary {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 12px 14px;
    border-bottom: 1px solid var(--line);
}

.document-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 1px;
    border-bottom: 1px solid var(--line);
    background: var(--line);
}

.document-kpis div {
    display: grid;
    gap: 4px;
    min-width: 0;
    background: #fff;
    padding: 12px 14px;
}

.document-kpis span,
.document-detail-grid span {
    color: var(--muted);
    font-size: 12px;
}

.document-kpis strong,
.document-detail-grid strong {
    font-size: 18px;
}

.document-toolbar {
    display: grid;
    grid-template-columns: minmax(130px, 170px) minmax(180px, 240px) minmax(150px, 190px) minmax(160px, 210px) minmax(240px, 1fr) auto auto;
    align-items: end;
    gap: 8px;
    padding: 12px 14px;
    border-bottom: 1px solid var(--line);
    background: #f7f9fa;
}

.document-toolbar select,
.document-toolbar input {
    width: 100%;
    height: 36px;
    border: 1px solid var(--line);
    background: #fff;
    padding: 0 8px;
}

.document-chip,
.document-flag,
.document-summary-card {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    border: 1px solid var(--line);
    background: #f6f8fa;
    color: #354555;
    padding: 0 8px;
    font-size: 12px;
}

.document-summary-card {
    display: grid;
    justify-items: start;
    min-height: 48px;
    padding: 7px 10px;
    cursor: pointer;
}

.document-summary-card.active,
.document-summary-card:hover {
    border-color: #9bc8c8;
    background: var(--accent-soft);
}

.document-summary-card strong {
    color: var(--text);
    font-size: 13px;
}

.document-summary-card span {
    color: var(--muted);
}

.document-flag {
    margin: 0 4px 4px 0;
}

.documents-table {
    min-width: 1320px;
}

.documents-table td {
    text-align: left;
    vertical-align: top;
    white-space: normal;
}

.document-name {
    font-weight: 600;
    color: #243746;
}

.document-open {
    border: 0;
    padding: 0;
    background: transparent;
    color: var(--accent);
    font-weight: 650;
    text-align: left;
    cursor: pointer;
}

.document-name a {
    color: var(--accent);
}

.document-path {
    margin-top: 3px;
    color: var(--muted);
    font-size: 12px;
    overflow-wrap: anywhere;
}

.document-detail-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 12px 14px;
    border-bottom: 1px solid var(--line);
    background: #f7f9fa;
}

.document-review-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    padding: 12px 14px 0;
    border-bottom: 1px solid var(--line);
    background: #f7f9fa;
}

.document-review-form label {
    display: grid;
    gap: 5px;
    min-width: 0;
    color: var(--muted);
    font-size: 12px;
}

.document-review-form select,
.document-review-form input,
.document-review-form textarea {
    width: 100%;
    border: 1px solid var(--line);
    background: #fff;
    color: var(--text);
    padding: 7px 8px;
}

.document-review-check {
    grid-template-columns: 16px minmax(0, 1fr);
    align-items: center;
    min-height: 32px;
    color: var(--text);
}

.document-review-check input {
    width: 16px;
    height: 16px;
}

.document-review-notes,
.document-review-form .document-detail-actions {
    grid-column: 1 / -1;
}

.document-review-form .document-detail-actions {
    margin: 0 -14px;
}

.document-detail-actions button:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}

.document-detail-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1px;
    border-bottom: 1px solid var(--line);
    background: var(--line);
}

.document-detail-grid div {
    display: grid;
    gap: 4px;
    min-width: 0;
    background: #fff;
    padding: 12px 14px;
}

.document-detail-list {
    margin: 0;
    border-bottom: 1px solid var(--line);
}

.document-detail-list div {
    display: grid;
    grid-template-columns: 150px minmax(0, 1fr);
    gap: 12px;
    padding: 10px 14px;
    border-top: 1px solid var(--line);
}

.document-detail-list div:first-child {
    border-top: 0;
}

.document-detail-list dt {
    color: var(--muted);
    font-size: 12px;
}

.document-detail-list dd {
    margin: 0;
    overflow-wrap: anywhere;
}

.document-text-preview {
    padding: 14px;
}

.document-text-preview h3 {
    margin: 0 0 8px;
    font-size: 15px;
}

.document-text-preview pre {
    max-height: 360px;
    overflow: auto;
    margin: 0;
    border: 1px solid var(--line);
    background: #fbfcfd;
    padding: 12px;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    font-family: Consolas, "Courier New", monospace;
    font-size: 12px;
    line-height: 1.45;
}

.status.compact {
    padding: 14px;
}

.muted-text {
    color: var(--muted);
    font-size: 12px;
}

.gl-editor-toolbar {
    display: grid;
    grid-template-columns: minmax(260px, 420px) auto auto 1fr;
    align-items: end;
    gap: 8px;
    padding: 12px 14px;
    border-bottom: 1px solid var(--line);
    background: #f7f9fa;
}

.gl-editor-toolbar input {
    width: 100%;
    height: 36px;
    border: 1px solid var(--line);
    background: #fff;
    padding: 0 9px;
}

.gl-editor-summary {
    justify-content: flex-start;
}

.gl-table td strong,
.gl-table td .muted-text {
    display: block;
}

.gl-table th,
.gl-table td {
    vertical-align: top;
}

.gl-editor-table th:nth-child(1),
.gl-editor-table td:nth-child(1) {
    width: 96px;
}

.gl-editor-table th:nth-child(2),
.gl-editor-table td:nth-child(2) {
    width: 220px;
    max-width: 220px;
}

.gl-editor-table th:nth-child(3),
.gl-editor-table td:nth-child(3),
.gl-editor-table th:nth-child(4),
.gl-editor-table td:nth-child(4) {
    width: 84px;
    text-align: right;
}

.gl-editor-table th:nth-child(5),
.gl-editor-table td:nth-child(5) {
    min-width: 280px;
    max-width: 420px;
    white-space: normal;
}

.gl-rec-status {
    color: var(--muted);
    font-size: 12px;
}

.gl-rec-status.reconciled {
    color: var(--green);
    font-weight: 650;
}

.recon-toolbar {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 16px;
    padding: 14px;
    border-bottom: 1px solid var(--line);
    background: #f7f9fa;
}

.late-fee-toolbar {
    align-items: end;
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(3, minmax(160px, 220px)) auto auto;
    margin-bottom: 16px;
}

.late-fee-toolbar label {
    color: #45515f;
    display: grid;
    font-size: 12px;
    font-weight: 700;
    gap: 6px;
    text-transform: uppercase;
}

.late-fee-toolbar input,
.late-fee-toolbar select {
    border: 1px solid var(--line);
    border-radius: 6px;
    color: #111827;
    font-size: 14px;
    font-weight: 500;
    min-height: 38px;
    padding: 7px 9px;
    text-transform: none;
}

.late-fee-table th:last-child,
.late-fee-table td:last-child {
    text-align: left;
}

.late-fee-comparison {
    border: 1px solid var(--line);
    border-radius: 8px;
    margin: 12px 0 16px;
    overflow: hidden;
}

.late-fee-comparison > header {
    align-items: center;
    background: #f7f9fa;
    border-bottom: 1px solid var(--line);
    display: flex;
    justify-content: space-between;
    padding: 12px 14px;
}

.late-fee-comparison > header span {
    color: var(--muted);
    display: block;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
}

.late-fee-comparison > header strong {
    color: #111827;
    display: block;
    font-size: 15px;
    margin-top: 2px;
}

.late-fee-compare-table {
    border-top: 1px solid var(--line);
}

.recon-date-control {
    display: grid;
    gap: 5px;
}

.recon-date-control input {
    height: 36px;
    border: 1px solid var(--line);
    background: #fff;
    padding: 0 8px;
}

.recon-filter {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.recon-filter-button {
    height: 34px;
    border: 1px solid var(--line);
    background: #fff;
    color: var(--text);
    padding: 0 10px;
    cursor: pointer;
}

.recon-filter-button.active {
    border-color: var(--accent);
    background: var(--accent);
    color: #fff;
}

.recon-table td:first-child {
    min-width: 230px;
}

.recon-workbench {
    min-width: 1120px;
}

.recon-selection-hud {
    position: fixed;
    z-index: 80;
    display: grid;
    gap: 4px;
    min-width: 220px;
    border: 1px solid var(--line-strong);
    background: #fff;
    box-shadow: 0 8px 24px rgba(17, 24, 39, 0.16);
    padding: 8px 10px;
    pointer-events: none;
}

.recon-selection-hud.hidden {
    display: none;
}

.recon-selection-hud div {
    display: grid;
    grid-template-columns: 72px 1fr auto;
    align-items: baseline;
    gap: 8px;
}

.recon-selection-hud span,
.recon-selection-hud em {
    color: var(--muted);
    font-size: 12px;
    font-style: normal;
}

.recon-selection-hud strong {
    text-align: right;
}

.recon-workbench-bar {
    display: flex;
    align-items: baseline;
    gap: 8px;
    padding: 10px 14px;
    border-bottom: 1px solid var(--line);
    background: #fff;
}

.recon-workbench-bar strong {
    font-size: 18px;
}

.recon-workbench-bar span {
    margin-right: 14px;
    color: var(--muted);
    font-size: 13px;
}

.compact-tool-button {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 30px;
    margin-left: auto;
    padding: 0 10px;
    font-size: 13px;
}

.compact-tool-button:disabled {
    cursor: wait;
    opacity: 0.65;
}

.recon-workbench-bar .recon-auto-status {
    min-width: 170px;
    margin-right: 0;
    text-align: left;
}

.recon-entry-grid {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

.recon-entry-grid th {
    position: sticky;
    top: 0;
    z-index: 2;
    border-bottom: 1px solid var(--line-strong);
    background: #edf1f4;
    color: #354555;
    padding: 8px;
    text-align: left;
    white-space: nowrap;
}

.recon-entry-grid td {
    border-bottom: 1px solid var(--line);
    padding: 7px 8px;
    vertical-align: top;
}

.recon-entry-grid th:nth-child(1),
.recon-entry-grid td:nth-child(1) {
    width: 92px;
}

.recon-entry-grid th:nth-child(2),
.recon-entry-grid td:nth-child(2) {
    width: 360px;
}

.recon-entry-grid th:nth-child(3),
.recon-entry-grid td:nth-child(3),
.recon-entry-grid th:nth-child(5),
.recon-entry-grid td:nth-child(5),
.recon-entry-grid th:nth-child(7),
.recon-entry-grid td:nth-child(7) {
    width: 112px;
    text-align: right;
}

.recon-entry-grid th:nth-child(4),
.recon-entry-grid td:nth-child(4),
.recon-entry-grid th:nth-child(6),
.recon-entry-grid td:nth-child(6) {
    width: 220px;
    text-align: left;
}

.recon-entry-grid th:nth-child(8),
.recon-entry-grid td:nth-child(8) {
    width: 104px;
    text-align: left;
}

.recon-hoa-header td {
    border-top: 1px solid var(--line-strong);
    border-bottom: 1px solid var(--line-strong);
    background: #f3f6f7;
    padding: 11px 10px;
}

.recon-side-header td {
    border-top: 2px solid var(--line-strong);
    border-bottom: 1px solid var(--line-strong);
    background: #e7edf0;
    color: #263642;
    font-weight: 750;
    padding: 10px;
}

.recon-section-action-cell {
    text-align: left;
}

.recon-accept-button {
    border: 1px solid var(--line-strong);
    background: #ffffff;
    color: var(--text);
    font-size: 12px;
    font-weight: 650;
    padding: 5px 9px;
}

.recon-accept-button:disabled {
    color: var(--muted);
    background: #f3f6f7;
}

.recon-hoa-header strong {
    margin-right: 12px;
    font-size: 16px;
}

.recon-hoa-header span {
    color: #344454;
    font-size: 13px;
}

.recon-header-proof {
    display: inline-flex;
    justify-content: center;
    gap: 22px;
    align-items: baseline;
    width: min(620px, 46vw);
    margin-left: 28px;
    color: var(--text);
    font-size: 15px;
    font-weight: 700;
}

.recon-header-proof b {
    font-size: 15px;
}

.recon-entry-row.saved td {
    background: #eef7f1;
}

.recon-db-row {
    cursor: pointer;
}

.recon-db-row.selected td {
    background: #e4f3f2;
    box-shadow: inset 0 1px 0 var(--accent), inset 0 -1px 0 var(--accent);
}

.bank-drop-target.selected-bank td {
    background: #eef4ff;
    box-shadow: inset 0 1px 0 #5277bd, inset 0 -1px 0 #5277bd;
}

.bound-db-detail-header td {
    background: #eef7f1;
    border-top: 1px solid #bcd7ca;
    color: var(--green);
    font-weight: 650;
}

.bound-db-detail-row td {
    background: #f7fbf8;
    color: var(--muted);
    font-size: 13px;
}

.reconciled-gl-header td {
    background: #f4f7f8;
    border-top: 1px solid var(--line);
    color: #344454;
    font-weight: 650;
}

.reconciled-gl-row td {
    background: #fbfcfd;
    color: var(--muted);
    font-size: 13px;
}

.recon-entry-row.saving td {
    background: #fffaf0;
}

.recon-hoa-cell strong,
.recon-hoa-cell span {
    display: block;
}

.recon-hoa-cell span {
    margin-top: 3px;
    color: var(--muted);
    font-size: 12px;
}

.memo-cell {
    white-space: normal;
    line-height: 1.3;
}

.recon-queue-meta {
    color: var(--muted);
    font-size: 12px;
    margin-top: 4px;
}

.recon-suggestion-list {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 6px;
}

.recon-suggestion-list span {
    border: 1px solid var(--line);
    background: #f7f9fa;
    color: #344454;
    font-size: 12px;
    padding: 2px 6px;
}

.amount-cell {
    font-weight: 650;
}

.gl-code-entry,
.apply-code-entry,
.entry-amount,
.manual-date-entry,
.manual-memo-entry,
.manual-bank-amount {
    width: 100%;
    height: 32px;
    border: 1px solid var(--line);
    background: #fff;
    padding: 0 7px;
}

.gl-code-entry.unmatched,
.apply-code-entry.unmatched {
    border-color: #d7952a;
    background: #fffaf0;
}

.entry-amount,
.manual-bank-amount {
    text-align: right;
}

.manual-entry-row td {
    background: #fbfcfd;
}

.remaining-cell,
.entry-status {
    color: var(--muted);
    font-size: 13px;
    white-space: normal;
}

.inline-undo {
    margin-left: 6px;
    border: 1px solid var(--line);
    background: #fff;
    color: var(--accent);
    padding: 2px 6px;
    cursor: pointer;
    font-size: 12px;
}

.gl-table th:last-child,
.gl-table td:last-child {
    width: 118px;
    text-align: left;
}

.gl-row-actions {
    display: none;
    align-items: center;
    gap: 5px;
    white-space: nowrap;
}

.gl-actions-enabled .gl-row-actions {
    display: inline-flex;
}

.gl-edit-toggle {
    justify-self: end;
}

.gl-edit-toggle.active {
    border-color: #9bc8c8;
    background: var(--accent-soft);
    color: var(--accent);
}

.gl-edit-toggle svg {
    width: 16px;
    height: 16px;
}

.transaction-editor {
    display: grid;
    gap: 0;
    min-width: 1080px;
}

.transaction-editor-toolbar {
    display: grid;
    grid-template-columns: auto minmax(260px, 1fr) auto auto;
    align-items: end;
    gap: 10px;
    padding: 12px 14px;
    border-bottom: 1px solid var(--line);
    background: #f7f9fa;
}

.transaction-editor-toolbar label {
    display: grid;
    gap: 4px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
}

.transaction-editor-toolbar input,
.transaction-editor-table input {
    width: 100%;
    height: 34px;
    border: 1px solid var(--line);
    background: #fff;
    padding: 0 8px;
}

.transaction-edit-totals {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
    color: var(--muted);
    font-size: 12px;
}

.transaction-edit-totals strong {
    color: var(--text);
    font-size: 14px;
}

.transaction-edit-totals .balanced strong,
.transaction-edit-totals .balanced {
    color: var(--green);
}

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

.transaction-editor-table th:nth-child(1),
.transaction-editor-table td:nth-child(1) {
    width: 132px;
}

.transaction-editor-table th:nth-child(2),
.transaction-editor-table td:nth-child(2) {
    min-width: 290px;
}

.transaction-editor-table th:nth-child(3),
.transaction-editor-table td:nth-child(3) {
    min-width: 280px;
}

.transaction-editor-table th:nth-child(4),
.transaction-editor-table td:nth-child(4),
.transaction-editor-table th:nth-child(5),
.transaction-editor-table td:nth-child(5) {
    width: 120px;
}

.transaction-editor-row.locked {
    background: #f8fafb;
}

.transaction-editor-row.locked input {
    color: var(--muted);
    background: #eef2f4;
}

.invoice-doc-actions {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
}

.invoice-doc-button {
    display: inline-grid;
    place-items: center;
    width: 26px;
    height: 26px;
    padding: 0;
    border: 1px solid var(--line);
    background: #fff;
    color: var(--accent);
}

.invoice-doc-button:hover,
.invoice-doc-button:focus-visible {
    border-color: #9bc8c8;
    background: var(--accent-soft);
}

.invoice-doc-button svg {
    width: 15px;
    height: 15px;
}

.sortable-header {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    width: 100%;
    min-height: 26px;
    border: 0;
    padding: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    font-weight: 700;
    text-align: left;
    cursor: pointer;
}

.sortable-header:hover,
.sortable-header:focus-visible {
    color: var(--accent);
}

.sort-indicator {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    min-width: 16px;
    color: var(--accent);
    font-size: 11px;
}

.sort-indicator svg {
    width: 13px;
    height: 13px;
}

.invoice-doc-bundle-button {
    display: inline-grid;
    place-items: center;
    width: 32px;
    height: 28px;
    padding: 0;
    border: 1px solid var(--line);
    background: #fff;
    color: var(--accent);
}

.invoice-doc-bundle-button:hover,
.invoice-doc-bundle-button:focus-visible {
    border-color: #9bc8c8;
    background: var(--accent-soft);
}

.invoice-doc-bundle-button:disabled {
    color: var(--muted);
    background: #f3f6f7;
    cursor: default;
}

.double-pdf-icon {
    position: relative;
    width: 21px;
    height: 18px;
}

.double-pdf-icon svg {
    position: absolute;
    width: 15px;
    height: 15px;
}

.double-pdf-icon svg:first-child {
    left: 0;
    top: 3px;
    opacity: 0.72;
}

.double-pdf-icon svg:last-child {
    right: 0;
    top: 0;
}

.pdf-viewer-overlay {
    position: fixed;
    inset: 0;
    z-index: 80;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 0;
    background: rgba(18, 30, 42, 0.58);
}

.pdf-viewer-overlay.open {
    display: flex;
}

.pdf-viewer-panel {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    width: min(96vw, max(860px, calc((100vh - 44px) * 0.82)));
    height: 100vh;
    border: 1px solid var(--line-strong);
    background: #fff;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.24);
}

.pdf-viewer-overlay.multi-page .pdf-viewer-panel {
    width: min(96vw, max(1120px, calc(((100vh - 44px) * 0.82) + 300px)));
}

.pdf-viewer-header {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    min-width: 0;
    min-height: 44px;
    padding: 5px 8px;
    border-bottom: 1px solid var(--line);
    background: #f7f9fa;
}

.ghost-toggle {
    border: 1px solid var(--line-strong);
    border-radius: 4px;
    padding: 6px 10px;
    background: transparent;
    color: var(--muted);
}

.ghost-toggle:hover,
.ghost-toggle.active {
    border-color: var(--accent);
    color: var(--text);
    background: #eef7f7;
}

.pdf-viewer-frame {
    width: 100%;
    height: 100%;
    border: 0;
    background: #e8edf1;
}

body.pdf-viewer-open {
    overflow: hidden;
}

.pdf-bundle-overlay {
    position: fixed;
    inset: 0;
    z-index: 82;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 0;
    background: rgba(18, 30, 42, 0.58);
}

.pdf-bundle-overlay.open {
    display: flex;
}

.pdf-bundle-panel {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    width: min(96vw, max(860px, calc((100vh - 44px) * 0.82)));
    height: 100vh;
    border: 1px solid var(--line-strong);
    background: #fff;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.24);
}

.pdf-bundle-overlay.multi-page .pdf-bundle-panel {
    width: min(96vw, max(1120px, calc(((100vh - 44px) * 0.82) + 300px)));
}

.pdf-bundle-list {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    min-width: 0;
    border-right: 1px solid var(--line);
    background: #f7f9fa;
}

.pdf-bundle-list header {
    display: grid;
    gap: 2px;
    min-height: 44px;
    padding: 8px 10px;
    border-bottom: 1px solid var(--line);
}

.pdf-bundle-list header span {
    color: var(--muted);
    font-size: 12px;
}

.pdf-bundle-items {
    overflow: auto;
    padding: 8px;
}

.pdf-bundle-items button,
.pdf-bundle-item {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    width: 100%;
    min-height: 36px;
    border: 1px solid transparent;
    padding: 6px 8px;
    background: transparent;
    color: var(--text);
    text-align: left;
}

.pdf-bundle-items button:hover,
.pdf-bundle-items button.active,
.pdf-bundle-item {
    border-color: #9bc8c8;
    background: #fff;
}

.pdf-bundle-items svg {
    width: 16px;
    height: 16px;
    color: var(--accent);
}

.pdf-bundle-items span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pdf-bundle-viewer {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    min-width: 0;
    position: relative;
}

.pdf-bundle-viewer .pdf-viewer-frame {
    grid-row: 2;
    grid-column: 1;
}

.pdf-bundle-loading {
    grid-row: 2;
    grid-column: 1;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #e8edf1;
    color: var(--muted);
    font-size: 14px;
    font-weight: 650;
}

.pdf-bundle-loading.hidden {
    display: none;
}

@media (orientation: portrait) {
    .pdf-viewer-panel {
        width: 100vw;
        height: 100vh;
    }

    .pdf-bundle-panel {
        grid-template-columns: 1fr;
        width: 100vw;
        height: 100vh;
    }

    .pdf-bundle-list {
        border-right: 0;
        border-bottom: 1px solid var(--line);
    }
}

.inline-action {
    min-height: 26px;
    border: 1px solid var(--line);
    background: #fff;
    color: var(--accent);
    padding: 0 7px;
    cursor: pointer;
    font-size: 12px;
}

.inline-action.danger {
    color: var(--danger);
}

.inline-action:disabled {
    color: var(--muted);
    background: #f3f6f7;
    cursor: default;
}

.split-row td {
    background: #fbfcfd;
}

.split-label {
    color: var(--muted);
    font-size: 13px;
}

.recon-extra-section {
    border-top: 1px solid var(--line-strong);
    margin-top: 18px;
}

.recon-extra-section h3 {
    margin: 0;
    padding: 12px 14px;
    border-bottom: 1px solid var(--line);
    background: #f7f9fa;
    font-size: 15px;
}

.compact-grid th,
.compact-grid td {
    position: static;
}

.row-warning td {
    background: #fffaf0;
}

.status-pill {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    border: 1px solid var(--line);
    padding: 0 8px;
    font-size: 12px;
    font-weight: 650;
}

.status-pill.mismatched {
    border-color: #e6c66f;
    background: var(--warn-bg);
    color: var(--warn);
}

.status-pill.missing_bank {
    border-color: #d5dbe2;
    background: #f2f4f6;
    color: var(--muted);
}

.status-pill.reconciled {
    border-color: #bcd7ca;
    background: #e7f3ed;
    color: var(--green);
}

.status-pill.ready {
    border-color: #bcd7ca;
    background: #e7f3ed;
    color: var(--green);
}

.status-pill.added {
    border-color: #bcd7ca;
    background: #e7f3ed;
    color: var(--green);
}

.status-pill.changed {
    border-color: #e6c66f;
    background: var(--warn-bg);
    color: var(--warn);
}

.status-pill.removed {
    border-color: #e1b7b7;
    background: #fff0f0;
    color: var(--danger);
}

.status-pill.unchanged {
    border-color: #d5dbe2;
    background: #f2f4f6;
    color: var(--muted);
}

.status-pill.existing_late_fee_review,
.status-pill.no_policy,
.status-pill.no_late_fee_days,
.status-pill.no_late_fee_amount {
    border-color: #e6c66f;
    background: var(--warn-bg);
    color: var(--warn);
}

.status-pill.excluded_ach,
.status-pill.excluded_payment_plan,
.status-pill.excluded_no_late_fees {
    border-color: #c7d2fe;
    background: #eef2ff;
    color: #3730a3;
}

.status-pill.needs_review,
.status-pill.pending_review,
.status-pill.partial_text_needs_ocr,
.status-pill.ocr_required,
.status-pill.requires_ocr,
.status-pill.missing {
    border-color: #e6c66f;
    background: var(--warn-bg);
    color: var(--warn);
}

.status-pill.current,
.status-pill.approved,
.status-pill.published,
.status-pill.extracted,
.status-pill.forced_high_quality_ocr,
.status-pill.embedded_plus_ocr,
.status-pill.embedded_text {
    border-color: #bcd7ca;
    background: #e7f3ed;
    color: var(--green);
}

.status-pill.superseded,
.status-pill.not_core,
.status-pill.archive_do_not_use,
.status-pill.rejected,
.status-pill.restricted_sensitive,
.status-pill.error,
.status-pill.storage_blocked,
.status-pill.unsupported {
    border-color: #e1b7b7;
    background: #fff0f0;
    color: var(--danger);
}

.recon-detail-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1px;
    border-bottom: 1px solid var(--line);
    background: var(--line);
}

.recon-detail-summary div {
    display: grid;
    gap: 4px;
    min-width: 0;
    background: #f7f9fa;
    padding: 12px 14px;
}

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

.recon-detail-summary strong {
    font-size: 18px;
}

.recon-workspace {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    min-height: calc(100vh - 150px);
}

.recon-column {
    min-width: 0;
    border-right: 1px solid var(--line);
}

.recon-column:last-child {
    border-right: 0;
}

.recon-column header {
    position: sticky;
    top: 0;
    z-index: 1;
    padding: 12px 14px;
    border-bottom: 1px solid var(--line);
    background: #edf1f4;
}

.recon-column h3 {
    margin: 0;
    font-size: 15px;
}

.recon-item {
    display: grid;
    gap: 9px;
    margin: 10px;
    border: 1px solid var(--line);
    background: #fff;
    padding: 10px;
}

.recon-item[draggable="true"] {
    cursor: grab;
}

.recon-item.pending-match {
    border-color: var(--accent);
    box-shadow: inset 0 0 0 1px var(--accent);
}

.recon-item-main {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
}

.recon-item-main strong {
    font-size: 16px;
}

.recon-item-main span,
.recon-item p {
    color: var(--muted);
}

.recon-item p {
    margin: 0;
    white-space: normal;
}

.split-lines {
    display: grid;
    gap: 6px;
}

.split-editor {
    display: grid;
    grid-template-columns: minmax(160px, 1.2fr) 100px minmax(120px, 1fr);
    gap: 6px;
}

.split-editor select,
.split-editor input {
    min-width: 0;
    height: 36px;
    border: 1px solid var(--line);
    background: #fff;
    padding: 0 8px;
}

.recon-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.recon-item-status {
    border: 1px solid #bcd7ca;
    background: #e7f3ed;
    color: var(--green);
    padding: 8px 10px;
    font-size: 13px;
}

.recon-item-status.error {
    border-color: #e6c66f;
    background: var(--warn-bg);
    color: var(--warn);
}

.search-shell {
    display: grid;
    gap: 12px;
    max-width: 1280px;
}

.search-command {
    border: 1px solid var(--line);
    background: #fff;
    padding: 14px;
}

.search-input-row {
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
}

.search-input-row svg {
    width: 20px;
    height: 20px;
    color: var(--accent);
}

.search-input-row input {
    width: 100%;
    min-height: 42px;
    border: 1px solid var(--line-strong);
    padding: 0 12px;
    font-size: 16px;
}

.search-toolbar,
.search-chip-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.search-toolbar {
    align-items: center;
    margin-top: 12px;
    color: var(--muted);
    font-size: 13px;
}

.search-toolbar label {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.advanced-search-grid {
    display: none;
    grid-template-columns: repeat(5, minmax(130px, 1fr));
    gap: 10px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--line);
}

.advanced-search-grid.open {
    display: grid;
}

.advanced-search-grid label {
    display: grid;
    gap: 5px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
}

.advanced-search-grid input,
.advanced-search-grid select {
    min-height: 34px;
    border: 1px solid var(--line);
    padding: 0 8px;
    color: var(--text);
    text-transform: none;
}

.search-results {
    display: grid;
    gap: 8px;
}

.search-result {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 16px;
    align-items: center;
    border: 1px solid var(--line);
    background: #fff;
    padding: 12px;
}

.search-result-title {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    color: var(--muted);
    font-size: 12px;
}

.search-result-title strong {
    color: var(--accent);
    font-size: 14px;
}

.search-result h2 {
    margin: 4px 0 2px;
    font-size: 18px;
}

.search-result p {
    margin: 0 0 8px;
    color: var(--muted);
}

.search-chip-row span {
    border: 1px solid var(--line);
    background: #f6f8fa;
    padding: 4px 7px;
    color: #344454;
    font-size: 12px;
}

.search-result-side {
    display: grid;
    justify-items: end;
    gap: 6px;
}

.record-search-shell {
    display: grid;
    gap: 12px;
    max-width: 1380px;
}

.record-filter-row,
.record-citation-row,
.record-meta-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.record-filter-row {
    margin-top: 12px;
    color: var(--muted);
    font-size: 13px;
}

.record-filter-row label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.record-filter-row input {
    min-height: 32px;
    border: 1px solid var(--line);
    padding: 0 8px;
}

.record-answer,
.record-result-panel {
    border: 1px solid var(--line);
    background: #fff;
}

.record-answer {
    display: grid;
    gap: 10px;
    padding: 14px;
}

.record-answer span,
.record-answer p {
    color: var(--muted);
    font-size: 12px;
}

.record-answer h2 {
    margin: 4px 0;
    font-size: 18px;
    line-height: 1.35;
}

.record-citation-row span,
.record-meta-row span {
    border: 1px solid var(--line);
    background: #f6f8fa;
    padding: 4px 7px;
    color: #344454;
    font-size: 12px;
}

.record-results-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 12px;
}

.record-result-panel header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 48px;
    padding: 10px 12px;
    border-bottom: 1px solid var(--line);
    background: #f7f9fa;
}

.record-result-panel h3 {
    margin: 0;
    font-size: 15px;
}

.record-result-list {
    display: grid;
}

.record-evidence {
    display: grid;
    gap: 6px;
    border-bottom: 1px solid var(--line);
    padding: 12px;
}

.record-evidence:last-child {
    border-bottom: 0;
}

.record-evidence-title {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    color: var(--muted);
    font-size: 12px;
}

.record-evidence h4 {
    margin: 0;
    font-size: 15px;
}

.record-evidence h4 a {
    color: var(--accent);
    text-decoration: none;
}

.record-evidence h4 a:hover {
    text-decoration: underline;
}

.record-evidence p {
    margin: 0;
    color: var(--muted);
    line-height: 1.4;
}

.crm-shell {
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
    min-width: 1080px;
    min-height: calc(100vh - 190px);
}

.crm-unit-list {
    border-right: 1px solid var(--line);
    background: #f7f9fa;
}

.crm-list-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px;
    border-bottom: 1px solid var(--line);
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
}

.crm-unit-option {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 4px 10px;
    width: 100%;
    border: 0;
    border-bottom: 1px solid var(--line);
    background: transparent;
    color: var(--text);
    padding: 12px 14px;
    text-align: left;
    cursor: pointer;
}

.crm-unit-option.active {
    background: #fff;
    box-shadow: inset 3px 0 0 var(--accent);
}

.crm-unit-option span {
    font-weight: 700;
}

.crm-unit-option em {
    grid-column: 1 / -1;
    color: var(--muted);
    font-size: 12px;
    font-style: normal;
}

.crm-detail {
    min-width: 0;
    background: #fff;
}

.crm-hero {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    padding: 18px;
    border-bottom: 1px solid var(--line);
    background: #fbfcfd;
}

.crm-eyebrow {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
}

.crm-hero h2 {
    margin: 5px 0 2px;
    font-size: 28px;
}

.crm-hero p {
    color: var(--muted);
}

.crm-balance {
    display: grid;
    gap: 3px;
    min-width: 140px;
    text-align: right;
}

.crm-balance span,
.crm-summary-grid span,
.crm-card-meta span {
    color: var(--muted);
    font-size: 12px;
}

.crm-balance strong {
    font-size: 24px;
}

.crm-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    border-bottom: 1px solid var(--line);
    background: var(--line);
    gap: 1px;
}

.crm-summary-grid div {
    display: grid;
    gap: 4px;
    background: #fff;
    padding: 12px 14px;
}

.crm-summary-grid strong {
    font-size: 18px;
}

.crm-workspace {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(340px, 0.8fr);
    gap: 1px;
    background: var(--line);
}

.crm-panel {
    min-width: 0;
    background: #fff;
}

.crm-relationships {
    grid-row: span 3;
}

.crm-panel header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 55px;
    padding: 10px 14px;
    border-bottom: 1px solid var(--line);
    background: #f7f9fa;
}

.crm-panel h3 {
    margin: 0;
    font-size: 15px;
}

.crm-affiliation-list,
.crm-contact-list {
    display: grid;
    gap: 10px;
    padding: 12px;
}

.crm-person-card {
    border: 1px solid var(--line);
    background: #fff;
}

.crm-person-card.draft,
.crm-contact-row.draft {
    border-style: dashed;
    background: #fbfcfd;
}

.crm-person-main {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    gap: 10px;
    align-items: start;
    padding: 12px;
}

.crm-avatar {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border: 1px solid var(--line-strong);
    background: var(--accent-soft);
    color: var(--accent);
    font-weight: 800;
}

.crm-person-main h4 {
    margin: 0;
    font-size: 16px;
}

.crm-person-main p {
    margin-top: 2px;
    color: var(--muted);
    font-size: 13px;
}

.crm-primary {
    border: 1px solid #bcd7ca;
    background: #e7f3ed;
    color: var(--green);
    padding: 3px 7px;
    font-size: 12px;
    font-weight: 700;
}

.crm-pill-row,
.crm-routing {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 8px;
}

.crm-pill,
.crm-routing span {
    border: 1px solid var(--line);
    background: #f6f8fa;
    color: #344454;
    padding: 3px 7px;
    font-size: 12px;
}

.crm-card-meta {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1px;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    background: var(--line);
}

.crm-card-meta div {
    display: grid;
    gap: 2px;
    background: #fbfcfd;
    padding: 9px 12px;
}

.crm-card-columns {
    display: grid;
    grid-template-columns: 1.15fr 1.1fr 0.85fr;
    gap: 12px;
    padding: 12px;
}

.crm-card-columns h5 {
    margin: 0 0 7px;
    color: var(--muted);
    font-size: 12px;
    text-transform: uppercase;
}

.crm-card-columns ul {
    display: grid;
    gap: 7px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.crm-card-columns li {
    display: grid;
    gap: 2px;
    color: var(--muted);
    font-size: 13px;
}

.crm-card-columns li strong {
    color: var(--text);
}

.crm-card-columns li em {
    color: var(--green);
    font-style: normal;
    font-size: 12px;
    font-weight: 700;
}

.crm-contact-row {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 9px;
    align-items: start;
    border: 1px solid var(--line);
    background: #fff;
    padding: 10px;
}

.crm-contact-row svg {
    width: 18px;
    height: 18px;
    margin-top: 2px;
    color: var(--accent);
}

.crm-contact-row strong,
.crm-contact-row span,
.crm-contact-row em {
    display: block;
}

.crm-contact-row span,
.crm-contact-row em {
    color: var(--muted);
    font-size: 12px;
    font-style: normal;
}

.crm-contact-row em {
    grid-column: 2;
    color: var(--green);
    font-weight: 700;
}

.crm-facts {
    display: grid;
    gap: 1px;
    margin: 0;
    background: var(--line);
}

.crm-facts div {
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr);
    gap: 12px;
    background: #fff;
    padding: 10px 14px;
}

.crm-facts dt {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.crm-facts dd {
    margin: 0;
    font-size: 13px;
}

.crm-map-table {
    width: 100%;
    border-collapse: collapse;
}

.crm-map-table th,
.crm-map-table td {
    border-bottom: 1px solid var(--line);
    padding: 9px 12px;
    vertical-align: top;
    text-align: left;
    font-size: 13px;
}

.crm-map-table th {
    width: 150px;
    color: #344454;
    background: #fbfcfd;
}

.crm-unit-scroll {
    max-height: calc(100vh - 285px);
    overflow: auto;
}

.crm-action-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border-bottom: 1px solid var(--line);
    background: #fff;
}

.crm-action-bar .tool-button:disabled {
    color: var(--muted);
    background: #f3f6f7;
    cursor: default;
}

.crm-action-bar span {
    color: var(--muted);
    font-size: 12px;
}

.crm-tabs {
    display: flex;
    gap: 6px;
    padding: 10px 14px 0;
    background: #fff;
}

.crm-tab {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 34px;
    border: 1px solid var(--line);
    background: #fff;
    color: var(--text);
    padding: 0 10px;
    cursor: pointer;
}

.crm-tab svg {
    width: 15px;
    height: 15px;
}

.crm-tab.active {
    border-color: var(--accent);
    background: var(--accent-soft);
    color: var(--accent);
    font-weight: 700;
}

.crm-tab-panel {
    padding: 14px;
}

.crm-panel.flat {
    border: 1px solid var(--line);
}

.crm-person-list {
    display: grid;
    gap: 16px;
    padding: 14px;
}

.crm-role-section {
    display: grid;
    gap: 8px;
}

.crm-role-section h4,
.crm-routing-layout h4 {
    margin: 0;
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.crm-compact-person {
    display: grid;
    grid-template-columns: 42px minmax(160px, 260px) minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    border: 1px solid var(--line);
    background: #fff;
    padding: 10px;
}

.crm-compact-person strong,
.crm-compact-person span {
    display: block;
}

.crm-compact-person span,
.crm-contact-mini span {
    color: var(--muted);
    font-size: 12px;
}

.crm-contact-mini {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.crm-contact-mini span,
.crm-flag-list span {
    border: 1px solid var(--line);
    background: #f6f8fa;
    padding: 4px 7px;
}

.crm-routing-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(320px, 0.9fr);
    gap: 18px;
    padding: 14px;
}

.crm-simple-table {
    width: 100%;
    margin-top: 8px;
    border-collapse: collapse;
}

.crm-simple-table th,
.crm-simple-table td {
    border-bottom: 1px solid var(--line);
    padding: 8px 9px;
    text-align: left;
    vertical-align: top;
    font-size: 13px;
}

.crm-simple-table th {
    width: 160px;
    color: #344454;
    background: #fbfcfd;
}

.crm-simple-table td span {
    display: block;
    color: var(--muted);
    font-size: 12px;
}

.crm-address-list {
    display: grid;
    gap: 8px;
    margin: 8px 0 16px;
}

.crm-address-list article {
    display: grid;
    gap: 3px;
    border: 1px solid var(--line);
    padding: 10px;
}

.crm-address-list span,
.crm-address-list em {
    color: var(--muted);
    font-size: 13px;
    font-style: normal;
}

.crm-facts.compact {
    margin-top: 8px;
    border: 1px solid var(--line);
}

.crm-note {
    margin-top: 8px;
    border: 1px solid var(--line);
    background: #fbfcfd;
    padding: 10px;
    color: #344454;
    white-space: pre-wrap;
}

.crm-flag-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 8px 0 16px;
}

@media (max-width: 1100px) {
    .app-shell {
        grid-template-columns: 1fr;
    }

    .sidebar {
        display: none;
    }

    .topbar {
        grid-template-columns: 1fr;
        align-items: stretch;
        position: static;
    }

    .date-controls {
        grid-template-columns: auto 1fr;
    }

    .report-switcher {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: 2px;
    }

    .report-tab {
        flex: 0 0 auto;
    }

    .report-header {
        align-items: flex-start;
        padding-top: 16px;
    }

    .report-actions {
        display: none;
    }

    .report-surface {
        margin: 0 12px 18px;
        border-left: 0;
        border-right: 0;
    }

    .operations-overview,
    .operations-grid,
    .dashboard-kpis,
    .dashboard-worklist,
    .dashboard-actions {
        grid-template-columns: 1fr;
    }

    .legacy-topbar {
        left: 0;
    }

    .legacy-association-rail {
        display: none;
    }

    .legacy-content {
        margin-left: 0;
    }

    .legacy-info-port {
        width: auto;
    }

    .legacy-info-table,
    .legacy-placeholder-panel {
        width: auto;
    }

    .legacy-info-table,
    .legacy-info-table tbody,
    .legacy-info-table tr,
    .legacy-info-table td {
        display: block;
    }

    .legacy-info-label {
        width: auto;
        padding-right: 0;
        margin-top: 6px;
        text-align: left;
    }

    .dashboard-tile {
        min-height: 96px;
    }

    .dashboard-list-row {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .dashboard-list-row span {
        grid-column: 1 / -1;
    }

    .recon-toolbar,
    .recon-workspace,
    .recon-detail-summary,
    .crm-shell,
    .crm-workspace,
    .crm-routing-layout,
    .crm-summary-grid,
    .crm-card-columns,
    .crm-compact-person {
        grid-template-columns: 1fr;
    }

    .recon-toolbar {
        align-items: stretch;
    }

    .crm-shell {
        min-width: 0;
    }

    .crm-unit-list {
        border-right: 0;
    }
}

@media print {
    body {
        background: #fff;
    }

    .app-shell {
        display: block;
        min-height: 0;
    }

    .sidebar,
    .topbar,
    .report-switcher,
    .report-actions,
    .diagnostics.hidden,
    .drilldown-panel {
        display: none;
    }

    .report-header {
        padding: 0 0 12px;
    }

    body.print-landscape .report-header {
        break-after: avoid;
        page-break-after: avoid;
    }

    .report-surface {
        margin: 0;
        overflow: visible;
        border: 0;
    }

    body.print-landscape .report-surface {
        break-before: avoid;
        page-break-before: avoid;
    }

    .report-table {
        min-width: 0;
        font-size: 11px;
    }

    .report-table th {
        position: static;
    }

    .invoice-doc-print-column {
        display: none;
    }

    body.print-landscape .revenue-expense-table {
        font-size: 9px;
    }

    body.print-landscape .revenue-expense-table th,
    body.print-landscape .revenue-expense-table td {
        padding: 5px 6px;
    }

    .drillable {
        color: inherit;
        text-decoration: none;
    }
}

.portal-page {
    background: var(--bg);
}

.portal-shell {
    min-height: 100vh;
}

.portal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 24px;
    background: var(--nav);
    color: #fff;
}

.portal-login-panel {
    display: grid;
    place-items: start center;
    padding: 48px 20px;
}

.portal-login-form {
    display: grid;
    gap: 10px;
    width: min(420px, 100%);
    padding: 24px;
    border: 1px solid var(--line);
    background: var(--panel);
}

.portal-login-form h1 {
    margin: 0 0 8px;
    font-size: 26px;
}

.portal-login-form input,
.portal-login-form select {
    width: 100%;
    min-height: 40px;
    border: 1px solid var(--line-strong);
    padding: 0 10px;
    background: #fff;
}

.primary-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 42px;
    border: 0;
    margin-top: 8px;
    color: #fff;
    background: var(--accent);
    cursor: pointer;
}

.primary-action svg {
    width: 18px;
    height: 18px;
}

.portal-status {
    min-height: 20px;
    margin: 4px 0 0;
    color: var(--danger);
}

.portal-help {
    margin: 4px 0 0;
    color: var(--muted);
    font-size: 13px;
}

.portal-grid {
    display: grid;
    grid-template-columns: minmax(260px, 340px) minmax(0, 1fr);
    gap: 20px;
    padding: 20px;
}

.portal-access-panel,
.portal-report-panel {
    border: 1px solid var(--line);
    background: var(--panel);
}

.portal-access-panel {
    display: grid;
    align-content: start;
    gap: 22px;
    padding: 18px;
}

.portal-access-panel h2 {
    margin: 4px 0;
    overflow-wrap: anywhere;
    font-size: 20px;
}

.portal-access-panel p {
    margin: 0;
    color: var(--muted);
}

.portal-kicker {
    display: block;
    color: var(--muted);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
}

.portal-list {
    display: grid;
    gap: 8px;
    margin-top: 8px;
}

.portal-impersonation-form {
    display: grid;
    gap: 8px;
    margin-top: 10px;
}

.portal-search-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
}

.portal-search-row input {
    min-width: 0;
    min-height: 36px;
    border: 1px solid var(--line-strong);
    padding: 0 10px;
}

.portal-list-button,
.portal-list-row {
    display: grid;
    gap: 3px;
    width: 100%;
    border: 1px solid var(--line);
    padding: 10px;
    background: #fff;
    text-align: left;
}

.portal-list-button {
    cursor: pointer;
}

.portal-list-button:hover {
    border-color: var(--accent);
    background: var(--accent-soft);
}

.portal-list-button span,
.portal-list-row span,
.portal-empty {
    color: var(--muted);
    font-size: 13px;
}

.portal-report-panel {
    min-width: 0;
}

.portal-report-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 18px;
    border-bottom: 1px solid var(--line);
}

.portal-report-toolbar h1 {
    margin: 0;
    font-size: 24px;
}

.portal-report-toolbar p {
    margin: 4px 0 0;
    color: var(--muted);
}

.portal-report-surface {
    overflow: auto;
    padding: 18px;
}

.portal-report-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 14px;
}

.portal-invoice-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}

.portal-invoice-summary div {
    display: grid;
    gap: 4px;
    border: 1px solid var(--line);
    padding: 12px;
    background: #fff;
}

.portal-invoice-summary span,
.portal-invoice-note,
.portal-invoice-action-status {
    color: var(--muted);
    font-size: 13px;
}

.portal-invoice-summary strong {
    font-size: 20px;
}

.portal-invoice-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 14px;
}

.portal-invoice-toolbar .tool-button.active {
    border-color: var(--accent);
    background: var(--accent-soft);
    color: var(--accent);
    font-weight: 700;
}

.portal-invoice-workspace {
    display: grid;
    grid-template-columns: minmax(320px, 400px) minmax(520px, 1fr);
    gap: 12px;
    align-items: stretch;
    min-height: min(86vh, 980px);
}

.portal-invoice-left-rail {
    display: grid;
    grid-template-rows: auto minmax(160px, 32vh) auto;
    min-width: 0;
    border: 1px solid var(--line);
    background: #fff;
}

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

.portal-invoice-navigation div:first-child {
    display: grid;
    gap: 2px;
}

.portal-invoice-navigation span,
.portal-invoice-preview-header span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
}

.portal-invoice-nav-buttons {
    display: inline-flex;
    gap: 6px;
}

.portal-invoice-nav-buttons .icon-button:disabled {
    opacity: 0.38;
    cursor: default;
}

.portal-invoice-queue {
    overflow: auto;
    border-bottom: 1px solid var(--line);
}

.portal-invoice-queue-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    width: 100%;
    border: 0;
    border-bottom: 1px solid var(--line);
    padding: 10px 12px;
    color: var(--text);
    background: #fff;
    cursor: pointer;
    text-align: left;
}

.portal-invoice-queue-item:hover,
.portal-invoice-queue-item.active {
    background: #edf5f3;
}

.portal-invoice-queue-item.active {
    box-shadow: inset 4px 0 0 var(--accent);
}

.portal-invoice-queue-item span {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.portal-invoice-queue-item span:last-child {
    justify-items: end;
    white-space: nowrap;
}

.portal-invoice-queue-item strong,
.portal-invoice-queue-item small {
    overflow: hidden;
    text-overflow: ellipsis;
}

.portal-invoice-queue-item small {
    color: var(--muted);
    font-size: 12px;
}

.portal-invoice-detail {
    display: grid;
    gap: 12px;
    overflow: auto;
    padding: 12px;
}

.portal-invoice-detail-header {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 12px;
}

.portal-invoice-detail h3 {
    margin: 0;
    font-size: 17px;
}

.portal-invoice-detail p {
    margin: 3px 0 0;
    color: var(--muted);
}

.portal-invoice-detail .portal-invoice-facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.portal-invoice-detail .portal-invoice-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.portal-invoice-detail .portal-invoice-actions textarea {
    grid-column: 1 / -1;
}

.portal-invoice-detail .portal-invoice-action-status {
    grid-column: 1 / -1;
}

.portal-invoice-detail .portal-autopay-request form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.portal-invoice-detail .portal-autopay-request button,
.portal-invoice-detail .portal-autopay-notes {
    grid-column: 1 / -1;
}

.portal-invoice-preview {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    min-width: 0;
    border: 1px solid var(--line);
    background: #2b2d2f;
}

.portal-invoice-preview-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px solid #1f2327;
    padding: 10px 12px;
    color: #fff;
    background: #3a3d40;
}

.portal-invoice-preview-header div {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.portal-invoice-preview-header strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.portal-invoice-preview-header .tool-button {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 36px;
    padding: 0 10px;
}

.portal-invoice-frame {
    width: 100%;
    height: 100%;
    min-height: min(78vh, 900px);
    border: 0;
    background: #2b2d2f;
}

.portal-invoice-list {
    display: grid;
    gap: 12px;
}

.portal-invoice-card {
    display: grid;
    gap: 12px;
    border: 1px solid var(--line);
    padding: 14px;
    background: #fff;
}

.portal-invoice-card-header {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 14px;
}

.portal-invoice-card h3 {
    margin: 0;
    font-size: 18px;
}

.portal-invoice-card p {
    margin: 3px 0 0;
    color: var(--muted);
}

.portal-invoice-amount {
    display: grid;
    justify-items: end;
    gap: 6px;
    white-space: nowrap;
}

.portal-invoice-amount strong {
    font-size: 20px;
}

.portal-invoice-facts {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin: 0;
}

.portal-invoice-facts div {
    min-width: 0;
}

.portal-invoice-facts dt {
    color: var(--muted);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
}

.portal-invoice-facts dd {
    margin: 2px 0 0;
    overflow-wrap: anywhere;
}

.portal-invoice-description {
    margin: 0;
}

.portal-invoice-actions {
    display: grid;
    grid-template-columns: auto minmax(180px, 1fr) auto auto auto minmax(90px, auto);
    gap: 8px;
    align-items: center;
}

.portal-invoice-actions textarea,
.portal-autopay-request textarea,
.portal-autopay-request input,
.portal-autopay-request select {
    width: 100%;
    min-width: 0;
    border: 1px solid var(--line-strong);
    padding: 8px 10px;
    background: #fff;
}

.portal-invoice-actions textarea {
    min-height: 38px;
    resize: vertical;
}

.portal-autopay-request {
    border-top: 1px solid var(--line);
    padding-top: 10px;
}

.portal-autopay-request summary {
    cursor: pointer;
    font-weight: 700;
}

.portal-autopay-request form {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr)) auto minmax(90px, auto);
    gap: 10px;
    align-items: end;
    margin-top: 10px;
}

.portal-autopay-request label {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.portal-autopay-request label span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.portal-autopay-notes {
    grid-column: 1 / -1;
}

.tool-button.danger {
    border-color: rgba(179, 38, 30, 0.3);
    color: var(--danger);
}

.status-pill.needs_extraction_review,
.status-pill.clarification_requested,
.status-pill.requested {
    background: #fff8e1;
    color: #8a5b00;
}

.status-pill.pending_approval {
    background: #e7f0ff;
    color: #174ea6;
}

.status-pill.approved,
.status-pill.active {
    background: #e5f5ec;
    color: #146c43;
}

.status-pill.rejected,
.status-pill.suspended,
.status-pill.expired {
    background: #fdeceb;
    color: var(--danger);
}

@media (max-width: 860px) {
    .portal-header,
    .portal-report-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .portal-grid {
        grid-template-columns: 1fr;
        padding: 12px;
    }

    .portal-invoice-summary,
    .portal-invoice-facts,
    .portal-autopay-request form {
        grid-template-columns: 1fr;
    }

    .portal-invoice-workspace {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    .portal-invoice-left-rail {
        grid-template-rows: auto minmax(120px, 28vh) auto;
    }

    .portal-invoice-detail .portal-invoice-actions,
    .portal-invoice-detail .portal-autopay-request form,
    .portal-invoice-detail .portal-invoice-facts {
        grid-template-columns: 1fr;
    }

    .portal-invoice-frame {
        min-height: 70vh;
    }

    .portal-invoice-card-header,
    .portal-invoice-actions {
        align-items: stretch;
        grid-template-columns: 1fr;
    }

    .portal-invoice-card-header {
        display: grid;
    }

    .portal-invoice-amount {
        justify-items: start;
    }
}
:root .hidden { display: none !important; }

.reporting-identity { display:flex; flex-wrap:wrap; align-items:center; gap:12px; padding:10px 20px; background:#eaf1f8; border-bottom:1px solid #ced9e5; }
.reporting-identity.impersonating { position:sticky; top:0; z-index:50; background:#fff0c2; border:2px solid #ac7012; }
.reporting-impersonation { display:flex; flex-wrap:wrap; gap:8px; flex:1; }
.reporting-impersonation-results { display:flex; flex-wrap:wrap; gap:8px; }
.audience-folder { margin:12px; border:1px solid #ced9e5; padding:12px; }
.audience-folder summary { cursor:pointer; font-weight:600; }
.audience-folder-policy { display:flex; flex-wrap:wrap; gap:12px; padding:12px 0; }
@media print { .reporting-identity { display:none!important; } }

.reporting-impersonating .drilldown-panel { top:var(--reporting-identity-height,70px);height:calc(100vh - var(--reporting-identity-height,70px)); }
.reporting-impersonating .pdf-viewer-overlay,.reporting-impersonating .pdf-bundle-overlay { top:var(--reporting-identity-height,70px); }

.payment-instructions { max-width:1100px;margin:24px auto;padding:0 16px 24px;line-height:1.6; }
.payment-intro { margin-bottom:24px;max-width:850px; }
.payment-intro h3 { font-size:1.6rem;margin-bottom:8px; }
.payment-methods { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;align-items:start; }
.payment-method { border:1px solid #d5dfe8;border-radius:12px;padding:24px;background:#fff; }
.payment-method h4 { font-size:1.18rem;line-height:1.4;margin:0 0 16px;color:#17364b; }
.payment-method h4 small { display:block;font-size:.9rem;font-weight:400;margin-top:4px; }
.payment-method ol { padding-left:24px; }.payment-method li { margin:0 0 12px;padding-left:4px; }
.payment-reference,.payment-help { padding:16px;background:#eef5fa;border-radius:8px;margin:16px 0; }
.payment-reference span { display:block;font-size:.9rem; }.payment-reference>strong { display:block;font-size:1.1rem;overflow-wrap:anywhere; }
.payment-reference p,.payment-help p { margin:8px 0 0; }.payment-method address { font-style:normal;padding:16px;border-left:4px solid #23718d;background:#f4f7fa;margin:16px 0; }
.payment-primary-link { font-weight:700; }.payment-method a { text-decoration:underline; }
@media(max-width:900px) { .payment-methods { grid-template-columns:1fr; }.payment-method { padding:18px; } }
@media print { .payment-methods { display:block; }.payment-method { break-inside:avoid;margin-bottom:16px; } }

/* Portal navigation starts hidden; financial controls never flash on other screens. */
.homeowner-portal .report-nav { visibility:hidden; }
.homeowner-portal.portal-ready .report-nav { visibility:visible; }
.homeowner-portal .tool-nav,.homeowner-portal .tool-switcher,.homeowner-portal .source-toggle,
.homeowner-portal .date-controls,.homeowner-portal .report-switcher,.homeowner-portal .report-actions { display:none!important; }
.homeowner-portal[data-portal-screen="financials"] .date-controls { display:grid!important; }
.homeowner-portal[data-portal-screen="financials"] .report-switcher { display:flex!important; }
.homeowner-portal[data-portal-screen="financials"] .report-actions { display:flex!important; }
.homeowner-portal .payment-methods { grid-template-columns:minmax(0,1fr); }
.homeowner-portal .payment-instructions { max-width:850px; }
.homeowner-portal .brand-subtitle { font-size:14px; }

@media screen and (max-width:1100px) {
    .homeowner-portal .sidebar { display:block;padding:14px; }
    .homeowner-portal .sidebar .brand { padding-bottom:12px; }
    .homeowner-portal .report-nav { margin-top:12px; }
}
@media print {
    .homeowner-portal .sidebar,.homeowner-portal .report-switcher,.homeowner-portal .date-controls,.homeowner-portal .report-actions { display:none!important; }
}

.recon-range-intro { padding:16px 24px;border-bottom:1px solid #d5dfe8; }
.recon-month-section { padding:20px 24px; }.recon-month-section>h2 { font-size:1.25rem;border-bottom:2px solid #d5dfe8;padding-bottom:10px; }
.recon-account-report { max-width:950px;margin:20px auto 28px;padding:20px;border:1px solid #d5dfe8;border-radius:10px;break-inside:avoid; }
.recon-account-report header { display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap; }
.recon-account-report h3 { margin:0;font-size:1.05rem; }.recon-balance-table td:first-child,.recon-balance-table th:first-child { text-align:left; }
.recon-balance-table td:last-child { white-space:nowrap; }.recon-account-report .invoice-doc-actions { margin-top:14px; }
@media(max-width:650px){.recon-month-section { padding:12px; }.recon-account-report { padding:12px; }}

.bank-statement-index { padding:16px 24px; }.bank-statement-index h2,.recon-section-heading { font-size:1.2rem; }.recon-section-heading { margin:20px 24px 0; }

/* Keep compact portal screens readable on large desktop monitors. */
@media screen {
    .homeowner-portal[data-portal-screen="ownStatement"] .report-surface { max-width:1080px; }
    .homeowner-portal[data-portal-screen="paymentInstructions"] .report-surface,
    .homeowner-portal[data-portal-screen="paymentQuestions"] .report-surface { max-width:960px; }
    .homeowner-portal[data-portal-screen="documents"] .report-surface,
    .homeowner-portal[data-active-report="bankReconciliation"] .report-surface { max-width:1120px; }
}