:root { font-family: Inter, "Microsoft YaHei", "PingFang SC", system-ui, sans-serif; color: #142438; background: #f4f7fb; font-synthesis: none; }
* { box-sizing: border-box; }
body { margin: 0; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
a { color: #1764a5; }
.shell { min-height: 100vh; display: grid; grid-template-columns: 252px minmax(0, 1fr); }
.sidebar { background: #10233c; color: #e7eff9; display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh; overflow-y: auto; }
.brand { display: flex; gap: 12px; align-items: center; padding: 26px 20px 27px; border-bottom: 1px solid #ffffff17; }
.brand-mark { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: linear-gradient(135deg, #24abc5, #3378d8); color: white; font-size: 15px; font-weight: 800; letter-spacing: .5px; }
.brand strong, .brand small { display: block; }
.brand strong { font-size: 16px; letter-spacing: .4px; }
.brand small { color: #9bb1c9; font-size: 11px; margin-top: 4px; }
.nav-heading { padding: 23px 21px 9px; color: #7892ae; font-size: 11px; font-weight: 700; letter-spacing: 1.2px; }
.nav-group { padding: 0 10px 12px; }
.nav-group-test { border-top: 1px solid #ffffff29; margin-top: 12px; padding-top: 9px; }
.nav-group-test .nav-link { color: #afc4d6; }
.nav-group-test .nav-badge { color: #b7dedf; border-color: #4b8993; }
.nav-group-title { color: #7892ae; font-size: 11px; padding: 14px 13px 7px; }
.nav-link { display: flex; align-items: center; gap: 11px; text-decoration: none; color: #c3d2e4; padding: 10px 12px; border-radius: 9px; font-size: 13px; transition: background .15s, color .15s; }
.nav-link:hover { background: #ffffff12; color: white; }
.nav-link.active { background: #2778bd; color: white; font-weight: 700; box-shadow: inset 3px 0 #58d8e1; }
.nav-icon { width: 20px; text-align: center; opacity: .9; }
.nav-badge { margin-left: auto; font-size: 10px; color: #a9bfd6; border: 1px solid #607b97; border-radius: 8px; padding: 1px 4px; }
.nav-link.active .nav-badge { color: white; border-color: #9cd6ff; }
.sidebar-foot { margin-top: auto; padding: 18px 21px; font-size: 11px; color: #91a7bd; border-top: 1px solid #ffffff17; }
.live-dot { display: inline-block; height: 7px; width: 7px; background: #45d3ad; border-radius: 50%; margin-right: 5px; }
.main-column { min-width: 0; }
.topbar { height: 68px; background: white; border-bottom: 1px solid #e4ebf2; display: flex; align-items: center; justify-content: space-between; padding: 0 28px; gap: 16px; }
.breadcrumbs { font-size: 13px; color: #8290a1; }
.breadcrumbs span { padding: 0 9px; color: #b4c1ce; }
.breadcrumbs strong { color: #253e57; font-weight: 650; }
.topbar-right { display: flex; gap: 14px; align-items: center; font-size: 12px; }
.env-chip, .status-chip { padding: 5px 9px; border-radius: 99px; font-size: 11px; font-weight: 700; }
.env-chip { background: #e8f4ff; color: #1763a0; }
.identity { color: #62758c; }
main { max-width: 1450px; margin: 0 auto; padding: 30px 30px 58px; }
.page-head { display: flex; justify-content: space-between; gap: 20px; align-items: flex-start; margin-bottom: 23px; }
.eyebrow { text-transform: uppercase; letter-spacing: 1.3px; color: #2377b6; font-weight: 800; font-size: 10px; margin-bottom: 8px; }
h1 { margin: 0; font-size: clamp(23px, 2.4vw, 30px); letter-spacing: -.5px; }
h2 { margin: 0 0 15px; font-size: 16px; }
h3 { margin: 0 0 9px; font-size: 13px; }
p { color: #697b8f; line-height: 1.65; }
.page-desc { margin: 7px 0 0; font-size: 13px; }
.page-actions { display: flex; gap: 9px; align-items: center; flex-wrap: wrap; }
.button, .button-secondary { border-radius: 8px; padding: 9px 13px; border: 1px solid #1f75b6; background: #1f75b6; color: white; font-size: 12px; font-weight: 700; text-decoration: none; }
.button-secondary { background: white; color: #1c6ca9; border-color: #bdd5e8; }
.button:hover { background: #115c94; }
.button:disabled { opacity: .55; cursor: wait; }
.workspace-tabs { display:flex; flex-wrap:wrap; gap:7px; margin:0 0 20px; padding:5px; border-bottom:1px solid #d8e3eb; }
.workspace-tab { color:#34536b; text-decoration:none; padding:10px 15px; border-radius:8px 8px 0 0; font-size:13px; font-weight:650; }
.workspace-tab:hover { background:#eaf3f8; }
.workspace-tab.active { color:#075e9a; background:#e6f2fa; box-shadow:inset 0 -2px #1875b3; }
.business-search-results { margin-top:18px; }
.business-pagination { display:flex; align-items:center; justify-content:flex-end; gap:12px; padding:15px 0; font-size:12px; color:#526b7b; }
.notice { border: 1px solid #cce1ef; background: #eff8fc; padding: 12px 15px; border-radius: 9px; color: #30546e; font-size: 12px; margin-bottom: 20px; }
.notice.warn { border-color: #f2dfb8; background: #fff9ec; color: #8d6119; }
.grid { display: grid; gap: 15px; }
.stats { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 18px; }
.two-col { grid-template-columns: minmax(0, 1.5fr) minmax(280px, .8fr); }
.card, .panel { background: white; border: 1px solid #e1e9f1; border-radius: 12px; box-shadow: 0 3px 16px #18365208; }
.card { padding: 20px; }
.card .label { color: #74869a; font-size: 11px; font-weight: 600; }
.card .value { font-size: clamp(21px, 2.1vw, 27px); margin-top: 10px; font-weight: 750; font-variant-numeric: tabular-nums; }
.card .foot { color: #8a9aaa; font-size: 10px; margin-top: 7px; }
.panel { padding: 21px; margin-bottom: 16px; min-width: 0; }
.panel-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 13px; }
.panel-head h2 { margin: 0; }
.panel-note { font-size: 11px; color: #91a0af; }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; font-size: 12px; white-space: nowrap; }
th { color: #65788e; font-weight: 700; background: #f7f9fc; }
td, th { text-align: left; border-bottom: 1px solid #eaf0f5; padding: 11px 10px; }
tbody tr:hover { background: #f9fbfd; }
td.numeric, th.numeric { text-align: right; font-variant-numeric: tabular-nums; }
.status-chip.good { background: #e2f5ed; color: #15734f; }
.status-chip.review { background: #fff2d9; color: #9b650e; }
.status-chip.muted { background: #eef2f5; color: #617185; }
.kv { display: grid; grid-template-columns: 145px 1fr; gap: 12px; font-size: 12px; padding: 12px 0; border-bottom: 1px solid #edf1f6; }
.kv:last-child { border: 0; }
.kv span:first-child { color: #7c8da0; }
.steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin: 13px 0 2px; }
.step { border: 1px solid #dfe9f1; border-radius: 9px; padding: 13px; font-size: 11px; color: #66798c; }
.step strong { display: block; color: #2e5677; font-size: 12px; margin-bottom: 4px; }
.step.active { border-color: #77bfd3; background: #edfbfc; }
.form-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; align-items: end; }
.business-search-filters { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.business-search-filters label { align-content: end; }
.business-search-filters label input[type=search] { margin-bottom: 2px; }
.company-picker { display: grid; grid-template-columns: minmax(210px, 1fr) minmax(280px, 2fr); gap: 14px; margin: 12px 0 18px; }
label { display: grid; gap: 6px; font-size: 11px; font-weight: 700; color: #62758b; }
input, select, textarea { border: 1px solid #cbd7e3; border-radius: 7px; padding: 9px 10px; background: #fff; color: #142438; min-width: 0; width: 100%; font-size: 12px; }
input:focus, select:focus, textarea:focus { outline: 2px solid #a6d5ef; border-color: #3689bb; }
.form-actions { display: flex; align-items: center; gap: 12px; margin-top: 17px; }
.audit-filters { display: grid; grid-template-columns: minmax(230px, 2fr) minmax(105px, .75fr) minmax(155px, 1.15fr) minmax(145px, 1fr) max-content; gap: 10px; align-items: end; }
.audit-filters > * { min-width: 0; }
.audit-filters .button { white-space: nowrap; }
.difference-batch-filters { display: grid; grid-template-columns: minmax(150px, 1fr) minmax(110px, .65fr) minmax(190px, 1.2fr) 136px; gap: 12px; align-items: end; }
.difference-batch-filters > * { min-width: 0; }
.difference-batch-filters .button { width: 136px; min-height: 36px; white-space: nowrap; }
.reconciliation-batch-filters { display: grid; grid-template-columns: minmax(150px, 1fr) minmax(110px, .7fr) minmax(190px, 1.4fr) 150px; gap: 12px; align-items: end; }
.reconciliation-batch-filters > * { min-width: 0; }
.reconciliation-batch-filters .button { width: 150px; min-height: 36px; white-space: nowrap; }
.reconciliation-batch-choice { margin-top: 12px; max-width: 680px; }
.reconciliation-batch-choice label[hidden] { display: none; }
.period-batch-filters { display: grid; grid-template-columns: minmax(150px, 1fr) minmax(110px, .7fr) minmax(190px, 1.4fr) 150px; gap: 12px; align-items: end; }
.period-batch-filters > * { min-width: 0; }
.period-batch-filters .button { width: 150px; min-height: 36px; white-space: nowrap; }
.period-batch-choice { margin-top: 12px; max-width: 680px; }
.period-batch-choice label[hidden] { display: none; }
.settlement-combination-filters { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 8px 0 18px; }
.settlement-combination-filters > * { min-width: 0; }
.difference-summary-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.difference-summary-grid .table-wrap { max-height: 205px; overflow: auto; margin-bottom: 12px; }
.difference-summary-grid th, .difference-queue th { position: sticky; top: 0; z-index: 1; }
.difference-queue-filters { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) 120px; gap: 10px; }
.difference-queue .table-wrap { max-height: 570px; overflow: auto; }
.difference-queue td, .difference-queue th { padding-top: 9px; padding-bottom: 9px; }
.period-exception-list .table-wrap { max-height: 560px; overflow: auto; }
.period-exception-list th { position: sticky; top: 0; z-index: 1; }
.batch-list-filters { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.batch-list-filters > * { min-width: 0; }
.micro { color: #91a0af; font-size: 11px; }
.empty { padding: 46px 25px; text-align: center; border: 1px dashed #cedde9; border-radius: 11px; background: #fafcff; }
.empty-icon { font-size: 32px; margin-bottom: 9px; color: #96aabe; }
.empty p { max-width: 570px; margin: 8px auto 0; font-size: 12px; }
.callout-list { margin: 18px auto 0; max-width: 520px; text-align: left; color: #536d84; font-size: 12px; line-height: 1.9; }
.spark { height: 100px; display: flex; align-items: end; gap: 8px; padding: 8px 3px 0; }
.spark div { flex: 1; min-height: 5px; border-radius: 4px 4px 0 0; background: linear-gradient(#55bdd2, #2c82b8); }
.toast { position: fixed; right: 22px; bottom: 22px; background: #102e47; color: white; padding: 12px 16px; border-radius: 9px; box-shadow: 0 8px 26px #122c4b3d; font-size: 12px; opacity: 0; transform: translateY(8px); transition: .2s; pointer-events: none; max-width: 400px; }
.toast.show { opacity: 1; transform: translateY(0); }
.icon-button { background: none; border: 0; font-size: 22px; color: #345a79; }
.audit-open { overflow: hidden; }
.audit-overlay { position: fixed; inset: 0; z-index: 30; display: flex; justify-content: flex-end; background: #10233c99; }
.audit-overlay[hidden] { display: none; }
.audit-drawer { width: min(1120px, calc(100vw - 36px)); height: 100vh; overflow-y: auto; background: #f4f7fb; box-shadow: -12px 0 36px #10233c30; }
.audit-drawer-head { position: sticky; top: 0; z-index: 1; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 18px 25px; background: white; border-bottom: 1px solid #dfe8f1; }
.audit-drawer-head h2 { margin: 0; font-size: 18px; }
.audit-drawer-head p { margin: 5px 0 0; font-size: 11px; }
.audit-sections { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; padding: 22px 25px 38px; color: #344b62; }
.audit-sections .panel { margin: 0; }
.audit-sections .audit-wide { grid-column: 1 / -1; }
.audit-sections .kv { grid-template-columns: minmax(118px, 37%) minmax(0, 1fr); }
.audit-sections .kv span { overflow-wrap: anywhere; }
.audit-sections .table-wrap { width: 100%; }
.review-content { padding: 22px 25px 38px; }
.review-content .panel { margin-bottom: 16px; }
.review-content label { margin-bottom: 14px; }
.review-content textarea { resize: vertical; }
.mobile-menu { display: none; }
.company-header { position: sticky; top: 0; z-index: 3; min-height: 142px; background: #fff; border: 1px solid #dfe8f1; border-radius: 12px; padding: 14px 18px; margin: 14px 0; box-shadow: 0 3px 12px #12304b09; }
.company-title-row { display: flex; gap: 8px; align-items: center; }
.company-title-row h2 { font-size: 16px; margin: 0; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.company-title-row .status-chip { flex-shrink: 0; }
.company-title-row .micro { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.company-title-row .button-secondary { margin-left: auto; flex-shrink: 0; }
.company-metrics { display: grid; grid-template-columns: .55fr .8fr 1.2fr 1.1fr 1.1fr .9fr .9fr; gap: 12px; margin: 14px 0 9px; }
.company-metric { display: flex; flex-direction: column; gap: 5px; font-size: 11px; color: #62758b; min-width: 0; }
.company-metric strong { color: #173e5b; font-size: 16px; font-variant-numeric: tabular-nums; }
.company-global-filters { display: grid; grid-template-columns: 130px 140px 140px minmax(100px,.6fr) minmax(130px,1fr) minmax(170px,1.4fr) auto; gap: 10px; align-items: end; margin: 16px 0; }
.company-tabs { overflow-x: auto; flex-wrap: nowrap; white-space: nowrap; position: sticky; top: 152px; z-index: 2; background: #f4f7fb; }
.company-subtabs { display: flex; flex-wrap: wrap; gap: 8px; margin: 16px 0; }
.company-subtabs .active { color: #136c91; border-color: #66b7d5; background: #e9f8fc; }
.company-profile-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.company-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 22px; }
.company-field { padding: 12px 0; display: flex; flex-direction: column; gap: 7px; border-bottom: 1px solid #edf1f6; min-width: 0; }
.company-field-label { font-size: 11px; color: #7c8da0; }
.company-field-value { font-size: 12px; overflow-wrap: anywhere; white-space: pre-wrap; color: #344b62; }
.company-field-wide { grid-column: 1 / -1; }
.company-list-controls { display: flex; gap: 12px; align-items: end; flex-wrap: wrap; margin: 14px 0; }
.company-list-controls label { flex: 1; max-width: 380px; }
.company-list-controls > select { width: auto; }
.company-list-totals { display: flex; gap: 20px; flex-wrap: wrap; font-size: 12px; margin: 10px 0; color: #3f647c; }
.company-table { max-height: 570px; overflow: auto; }
.company-table th { position: sticky; top: 0; z-index: 1; }
.company-table td:first-child, .company-table th:first-child { position: sticky; left: 0; background: #fff; }
.company-table th:first-child { z-index: 2; }
.company-table td { max-width: 240px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.company-table tbody tr { cursor: pointer; }
.company-table tbody tr:hover td { background: #f0f8fc; }
.company-drawer { width: min(1200px,75vw); }
.company-detail-body { padding: 22px 25px 38px; }
.company-detail-body .panel { margin-bottom: 16px; }
@media(max-width:1400px) { .company-global-filters { grid-template-columns: repeat(4,minmax(0,1fr)); } }
@media(max-width:760px) { .company-header,.company-tabs { position: static; }.company-global-filters { grid-template-columns: repeat(2,minmax(0,1fr)); }.company-profile-grid,.company-fields { grid-template-columns: 1fr; }.company-drawer { width: 100vw; }.company-metrics { gap: 12px; grid-template-columns: repeat(2,minmax(0,1fr)); }.company-detail-body { padding: 14px; }.company-title-row { flex-wrap: wrap; }.company-title-row h2 { white-space: normal; }.company-title-row .button-secondary { margin-left: 0; } }
@media (max-width: 1120px) { .stats { grid-template-columns: repeat(2, 1fr); } .two-col { grid-template-columns: 1fr; } .business-search-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); } .audit-filters { grid-template-columns: minmax(220px, 2fr) minmax(115px, 1fr) minmax(155px, 1fr); } .audit-filters .button { justify-self: start; } .difference-batch-filters, .reconciliation-batch-filters, .period-batch-filters, .settlement-combination-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .shell { grid-template-columns: 1fr; } .sidebar { position: fixed; z-index: 10; width: 252px; transform: translateX(-100%); transition: transform .2s; } .mobile-menu { display: block; } .topbar { padding: 0 18px; } main { padding: 24px 16px 50px; } .identity { display: none; } .form-grid, .company-picker, .settlement-combination-filters { grid-template-columns: 1fr; } .steps { grid-template-columns: repeat(2, 1fr); } .page-head { flex-direction: column; } .audit-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); } .audit-filters > select:first-child { grid-column: 1 / -1; } .difference-batch-filters, .reconciliation-batch-filters, .period-batch-filters, .difference-summary-grid, .difference-queue-filters, .batch-list-filters { grid-template-columns: 1fr; } .audit-drawer { width: 100vw; } .audit-sections { grid-template-columns: 1fr; padding: 14px; } .audit-drawer-head { padding: 14px; } .audit-sections .audit-wide { grid-column: auto; } .review-content { padding: 14px; } }
.company-period-toolbar { display:flex; align-items:flex-end; flex-wrap:wrap; gap:12px; margin-bottom:16px; }
.company-period-toolbar label,.company-period-form-grid label { display:flex; flex-direction:column; gap:6px; }
.company-period-table td { min-width:110px; max-width:300px; white-space:normal; overflow-wrap:anywhere; }
.company-period-risk { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:8px 0; border-bottom:1px solid var(--border,#e5e7eb); }
.company-period-form { margin-top:14px; padding:12px; border:1px solid var(--border,#e5e7eb); border-radius:8px; }
.company-period-form summary { cursor:pointer; font-weight:600; }
.company-period-form-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:12px; padding-top:12px; }
.company-period-form-grid textarea { min-height:85px; resize:vertical; }
.company-period-form-grid input,.company-period-form-grid select,.company-period-form-grid textarea { width:100%; box-sizing:border-box; }
.company-period-form-grid > .micro { grid-column:1/-1; }
.company-visual-controls { display:flex; align-items:flex-end; flex-wrap:wrap; gap:12px; margin-bottom:18px; }
.company-visual-controls label { display:flex; flex-direction:column; gap:6px; min-width:160px; }
.company-visual-controls select { max-width:100%; }
.company-visual-metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.company-visual-metric { border:1px solid #dce9f1; border-radius:10px; background:#f7fbfd; padding:14px 16px; display:flex; flex-direction:column; gap:6px; }
.company-visual-metric strong { font-size:22px; color:#163f56; }
.company-visual-metric span,.company-visual-metric small { color:#637787; }
.company-chart-scroll { overflow:auto; max-width:100%; border:1px solid #e2ebf1; border-radius:12px; background:linear-gradient(180deg,#fbfdff,#fff); margin:16px 0; }
.company-chart-scroll svg { display:block; max-width:none; }
.company-chart-column { font-size:14px; font-weight:600; fill:#335164; }
.company-chart-axis { font-size:12px; fill:#677e8e; }
.company-flow-title { font-size:13px; font-weight:600; fill:#204457; }
.company-flow-value { font-size:12px; fill:#617786; }
.company-flow-node,.company-flow-edge,.company-trend-hit { cursor:help; }
.company-flow-node:hover rect,.company-flow-node:focus rect { stroke-width:3; fill:#f1f8fc; }
.company-flow-edge:hover,.company-flow-edge:focus { stroke-opacity:.88; }
.company-trend-hit:hover,.company-trend-hit:focus { fill:#287fae; fill-opacity:.06; }
.company-flow-node:focus,.company-flow-edge:focus,.company-trend-hit:focus { outline:none; }
.company-chart-tooltip { position:fixed; z-index:1001; width:max-content; max-width:min(640px,calc(100vw - 24px)); padding:14px 18px; color:#edf6fb; background:#17374af2; border:1px solid #31586f; border-radius:9px; box-shadow:0 8px 25px #12394c25; font-size:12px; line-height:1.7; pointer-events:none; overflow-wrap:break-word; }
.company-chart-tooltip strong { display:block; color:#fff; margin-bottom:4px; }
.company-tooltip-section + .company-tooltip-section { margin-top:8px; padding-top:7px; border-top:1px solid #ffffff20; }
.company-tooltip-heading { display:block; font-size:11px; letter-spacing:.06em; margin-bottom:2px; }
.company-tooltip-metrics { color:#f0f7fb; }
.company-tooltip-metrics .company-tooltip-heading { color:#82dbc9; }
.company-tooltip-basis { color:#bddcef; }
.company-tooltip-basis .company-tooltip-heading { color:#8ec4ea; }
.company-tooltip-notes { color:#a8b9c4; font-size:11px; line-height:1.6; }
.company-tooltip-notes .company-tooltip-heading { color:#a8b9c4; }
.company-chart-tooltip[hidden] { display:none; }
.enterprise-filters { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:12px; margin-bottom:14px; }
.enterprise-filters label { display:flex; flex-direction:column; gap:6px; font-size:12px; color:#567084; }
.enterprise-multiselect { min-height:82px; max-width:100%; font-size:12px; }
.enterprise-comparison { display:grid; grid-template-columns:minmax(180px,1fr) 2fr 90px; gap:12px; align-items:center; margin:14px 0; font-size:12px; }
.enterprise-comparison-track { background:#edf4f8; height:18px; border-radius:4px; }
.enterprise-comparison-fill { background:#247fad; height:100%; border-radius:4px; }
.company-chart-notes { margin-top:16px; border-top:1px solid #e5edf2; padding-top:14px; }
.company-chart-notes summary { cursor:pointer; color:#335f78; font-weight:600; }
.company-chart-notes p { color:#617787; font-size:12px; }
.company-trend-legend { display:flex; flex-wrap:wrap; gap:7px; margin:12px 0; }
.company-trend-legend button[aria-pressed=false] { opacity:.42; }
.company-content { min-width:0; }
@media(max-width:760px) { .company-visual-metrics { grid-template-columns:1fr; }.company-visual-controls { align-items:stretch; }.company-visual-controls label { flex:1; min-width:140px; } }

.enterprise-metrics { grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); }

.enterprise-filter { display:flex; flex-direction:column; gap:6px; font-size:12px; color:#567084; min-width:0; }
.enterprise-select { position:relative; min-width:0; }
.enterprise-select > summary { cursor:pointer; background:white; border:1px solid #d6e1e9; border-radius:7px; padding:11px 28px 11px 12px; color:#213c50; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; list-style:none; }
.enterprise-select > summary::after { content:'▾'; position:absolute; right:10px; }
.enterprise-select > summary::-webkit-details-marker { display:none; }
.enterprise-select-menu { position:absolute; z-index:50; top:calc(100% + 4px); left:0; width:max(100%,280px); max-width:min(420px,85vw); padding:12px; background:white; border:1px solid #d6e1e9; border-radius:8px; box-shadow:0 8px 24px #17384e26; }
.enterprise-select-choices { max-height:280px; overflow:auto; margin-top:8px; }
.enterprise-filters .enterprise-select-option { flex-direction:row; align-items:flex-start; gap:8px; padding:7px 3px; cursor:pointer; color:#213c50; }
.enterprise-select-option input { width:16px; min-width:16px; height:16px; margin:1px 0 0; }
.enterprise-select-menu > input { width:100%; margin-bottom:8px; }

.enterprise-primary-filters { grid-template-columns:repeat(3,minmax(0,1fr)); }
@media(max-width:760px) { .enterprise-primary-filters { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:480px) { .enterprise-primary-filters { grid-template-columns:1fr; } }

.growth-funnel-row { margin: 12px 0; background: #edf3f7; border-radius: 5px; overflow: auto; }
.growth-funnel-bar { height: 12px; min-width: 0; background: #247fad; border-radius: 5px; }
/* Formal reconciliation workspace */
.fin-dialog {width:min(1000px,95vw);max-height:94vh;overflow:auto;padding:24px;background:var(--surface,#fff);margin:auto;border-radius:16px;}
.fin-form {display:grid;gap:16px;}
.fin-form input,.fin-form select,.fin-form textarea {width:100%;min-height:40px;padding:8px 10px;border:1px solid #d9e0e9;border-radius:8px;background:#fff;color:#172033;}
.fin-wide {grid-column:1/-1;}
.fin-record {padding:16px;margin:12px 0;border:1px solid #dce4ec;border-radius:12px;background:#fff;}
.fin-record details {margin-top:12px;color:#64748b;}
.fin-source {white-space:pre-wrap;overflow-wrap:anywhere;max-height:320px;overflow:auto;}
.fin-record .form-actions {flex-wrap:wrap;gap:8px;}
.filter-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;}
.metric-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:18px;}
.metric-card {background:#fff;border:1px solid #dce6ef;border-radius:12px;padding:18px;}
.metric-label {display:block;font-size:12px;color:#6a7e92;}
.metric-value {display:block;font-size:25px;font-variant-numeric:tabular-nums;margin-top:9px;color:#163c60;}
.fin-form .error {color:#b52631;}
.fin-workspace .form-actions {flex-wrap:wrap;}
.fin-workspace .form-actions select {flex:1 1 320px;width:auto;}
.fin-record .status-chip {background:#eaf2fb;color:#28577e;}
@media(max-width:800px){.filter-grid,.metric-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.fin-dialog{padding:16px;}}
@media(max-width:520px){.filter-grid,.metric-grid{grid-template-columns:1fr;}.fin-record .panel-head{align-items:flex-start;flex-direction:column;}}

.intake-multi {position:relative;margin-top:6px;min-width:200px;background:white;border:1px solid #cbd8e3;border-radius:6px;}
.intake-multi summary {padding:9px 12px;cursor:pointer;font-size:13px;}
.intake-multi-panel {position:absolute;z-index:20;top:100%;left:0;width:320px;padding:12px;background:white;border:1px solid #cbd8e3;border-radius:8px;box-shadow:0 8px 24px #17334a26;}
.intake-multi-panel>div {max-height:260px;overflow:auto;margin-top:8px;}
.intake-multi-panel label {display:flex;align-items:center;gap:8px;padding:6px;font-size:13px;}
.intake-multi-panel input[type=checkbox] {width:auto;margin:0;}

.membership-archive-filters { display:grid; grid-template-columns:200px minmax(280px,1fr); gap:16px; align-items:end; margin-bottom:12px; }
.membership-archive-filters label,.membership-archive-filters .enterprise-filter { display:flex; flex-direction:column; gap:6px; min-width:0; }
.membership-company-option { display:block; width:100%; text-align:left; margin-bottom:4px; white-space:normal; }
@media(max-width:600px) { .membership-archive-filters { grid-template-columns:1fr; } }

[hidden]{display:none!important}
.auth-permission-option{display:flex;align-items:center;gap:10px;padding:6px 12px}.auth-permission-option small{margin-left:auto}.auth-permission-option input{width:auto}.panel pre{white-space:pre-wrap;overflow-wrap:anywhere;max-height:420px;overflow:auto}

/* Unified user menu, usable by mouse, keyboard and touch. */
.account-menu{position:relative;padding:8px 0;color:#344c66;}
.account-menu-trigger{border:0;background:none;color:inherit;font:inherit;font-weight:600;padding:8px 10px;cursor:pointer;max-width:230px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.account-menu-trigger::after{content:' ▾';color:#8394a6;}
.account-menu-dropdown{display:none;position:absolute;right:0;top:100%;min-width:150px;padding:6px;background:#fff;border:1px solid #dbe4ee;border-radius:8px;box-shadow:0 8px 25px #22334b20;z-index:40;}
.account-menu:hover .account-menu-dropdown,.account-menu:focus-within .account-menu-dropdown,.account-menu.is-open .account-menu-dropdown{display:flex;flex-direction:column;}
.account-menu-dropdown a,.account-menu-dropdown button{display:block;text-align:left;padding:10px 12px;border:0;background:none;border-radius:5px;text-decoration:none;color:#344c66;font:inherit;cursor:pointer;white-space:nowrap;}
.account-menu-dropdown a:hover,.account-menu-dropdown button:hover,.account-menu-dropdown a:focus-visible,.account-menu-dropdown button:focus-visible{background:#edf5fa;color:#127bae;}
.personal-form{display:grid;grid-template-columns:minmax(200px,440px);gap:14px;max-width:560px;}
.personal-form label{display:flex;flex-direction:column;gap:7px;font-size:13px;}
.personal-form input{width:100%;box-sizing:border-box;}
.personal-form button{justify-self:start;}
@media(max-width:760px){.topbar-right .identity{display:block;}.account-menu-trigger{max-width:130px;}.topbar-right{gap:5px;}.topbar-right .env-chip{display:none;}}

/* Standalone sign-in: no navigation or management chrome before authentication. */
.auth-screen .sidebar,.auth-screen .topbar{display:none!important}
.auth-screen .shell{display:block;min-height:100vh}
.auth-screen .main-column{margin:0;min-height:100vh}
.auth-screen #main{max-width:500px;margin:0 auto;padding:clamp(40px,12vh,110px) 24px 40px}
.auth-screen .fin-form{display:flex;flex-direction:column;gap:16px}
.auth-screen .fin-form input{width:100%}
.auth-screen .fin-form button{align-self:stretch}
.auth-screen .panel-head{display:block}.auth-screen .panel-head h2{margin-bottom:10px}.auth-screen .panel-head p{margin:0}.auth-screen .fin-form .error:empty{display:none}

/* Keep each role and both labelled date controls on a single compact row. */
.role-grants{overflow-x:auto}
.role-grant-row{display:grid;grid-template-columns:minmax(180px,1fr) repeat(2,280px);align-items:center;gap:16px;min-width:772px;margin:12px 0}
.role-grant-row>label{display:flex;align-items:center;gap:10px;margin:0;white-space:nowrap;font-size:13px}
.role-grant-row>label:first-child{font-weight:500}
.role-grant-row input[type=checkbox]{width:16px;min-height:16px;margin:0;flex:none}
.role-grant-row input[type=datetime-local]{width:210px;min-width:0;min-height:36px;padding:6px 8px;flex:none;font-size:13px}
/* PowerLink BI sign-in: charging infrastructure, business insight and compliance. */
.auth-screen{background:#091d32;color:#eaf3fb}
.auth-screen .shell{background:radial-gradient(ellipse at 20% 70%,#14586c44,transparent 55%),radial-gradient(ellipse at 88% 15%,#24457655,transparent 50%),#091d32;position:relative}
.auth-screen .shell:before{content:'';position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(#7ba2c806 1px,transparent 1px),linear-gradient(90deg,#7ba2c806 1px,transparent 1px);background-size:64px 64px}
.auth-screen #main{max-width:1280px;padding:72px 64px;min-height:100vh;display:flex;align-items:center;position:relative}
.login-layout{width:100%;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(340px,420px);gap:76px;align-items:center}
.login-hero{min-width:0}
.login-brand{display:flex;align-items:center;gap:12px;font-size:21px;font-weight:650;letter-spacing:.2px;margin-bottom:50px}
.login-brand-mark{display:grid;place-items:center;width:42px;height:42px;border:1px solid #65d1d366;background:linear-gradient(135deg,#248fa6,#215a84);border-radius:12px;font-size:17px;color:#fff;box-shadow:0 8px 30px #17b5c014}
.login-eyebrow{font-size:12px;letter-spacing:3px;color:#7cd6d1;margin:0 0 20px}
.login-hero h1{font-size:clamp(28px,3vw,42px);line-height:1.35;font-weight:650;letter-spacing:1px;margin:0 0 18px;color:#f4f9fc}
.login-description{font-size:15px;line-height:1.8;color:#9fb5c8;margin:0}
.login-illustration{display:block;width:calc(100% + 20px);margin:20px 0 2px -20px;height:auto}
.login-flow-tags{display:flex;gap:10px;flex-wrap:wrap}
.login-flow-tags span{font-size:12px;color:#bdd8e2;border:1px solid #77b9cd33;background:#17435833;border-radius:6px;padding:7px 14px}
.login-hero-note{margin:20px 0 0;font-size:12px;letter-spacing:2px;color:#688ba4}
.login-entry{width:100%;margin-top:38px}
.auth-screen .login-card{background:#fff;color:#142438;border:1px solid #dce8f2;border-radius:18px;padding:38px 34px;box-shadow:0 24px 70px #00000030}
.auth-screen .login-card .panel-head{margin-bottom:30px}
.auth-screen .login-card h2{font-size:25px;font-weight:650;letter-spacing:.5px;margin-bottom:12px}
.auth-screen .login-card .panel-head p{color:#8493a3;font-size:13px;line-height:1.6}
.auth-screen .login-card .fin-form{gap:22px}
.auth-screen .login-card label{font-size:13px;font-weight:500;color:#425971;gap:10px}
.auth-screen .login-card input{min-height:46px;font-size:14px;background:#f8fafc;border-color:#d9e3ec;padding:12px 14px;transition:border-color .15s,box-shadow .15s}
.auth-screen .login-card input:focus{outline:0;border-color:#239aa8;box-shadow:0 0 0 3px #239aa819;background:#fff}
.auth-screen .login-card .button{margin-top:8px;min-height:46px;background:linear-gradient(105deg,#197dab,#168d98);border:0;border-radius:8px;font-size:14px;letter-spacing:2px;box-shadow:0 5px 16px #167f9a24}
.auth-screen .login-card .button:hover{filter:brightness(1.06)}
.login-entry-foot{text-align:center;font-size:11px;color:#7893ab;margin:22px 0 0;letter-spacing:1px}
@media(max-width:1050px){.auth-screen #main{padding:48px 36px}.login-layout{gap:40px;grid-template-columns:minmax(0,1fr) minmax(320px,380px)}.login-brand{margin-bottom:34px}.auth-screen .login-card{padding:32px 26px}}
@media(max-width:760px){.auth-screen #main{padding:32px 22px;align-items:flex-start}.login-layout{grid-template-columns:minmax(0,1fr);gap:28px;max-width:460px;margin:auto}.login-brand{margin-bottom:28px}.login-hero h1{font-size:28px}.login-eyebrow{letter-spacing:2px;margin-bottom:14px}.login-description{font-size:13px}.login-illustration{display:none}.login-flow-tags{margin-top:22px;gap:8px}.login-flow-tags span{padding:6px 11px}.login-hero-note{display:none}.login-entry{margin-top:0}.auth-screen .login-card{padding:28px 24px}.login-entry-foot{font-size:10px}}
@media(min-width:761px) and (max-height:800px){.auth-screen #main{padding-top:32px;padding-bottom:32px}.login-brand{margin-bottom:32px}.login-illustration{max-height:270px;object-fit:contain}}
