/* page-ledger: 미수금(#page-recv) 전용 보조 규칙 + 매출(#page-ledger) 숫자 조회 화면(맨 아래 lq-*, 2026-10-04). 매출의 옛 표·막대 규칙은 지웠다. 모든 선택자는 .ui 안에서만. 공통 부품은 ui.css 를 쓴다. */

/* 이 두 화면은 표가 넓어서 페이지 최대 폭 제한을 푼다 */
#page-recv.ui { max-width: none; }

/* 에메랄드 줄(미수금: 계산서·결제·발송이 모두 끝난 줄). 밝음/어두움 둘 다 */
.ui { --lg-done-bg: color-mix(in srgb, var(--ps-good, var(--ui-good-fg)) 13%, var(--ps-bg, var(--ui-surface))); --lg-done-bar: var(--ps-good, var(--ui-good-fg)); --lg-done-hover: color-mix(in srgb, var(--ps-good, var(--ui-good-fg)) 22%, var(--ps-bg, var(--ui-surface))); --lg-bar: var(--ui-chart-1); }
.ui .ui-table tr.ui-donerow { --ui-row-bg: var(--lg-done-bg); }
.ui .ui-table tr.ui-donerow:hover { --ui-row-bg: var(--lg-done-hover); }
.ui .ui-table tr.ui-donerow td:first-child { box-shadow: inset 5px 0 0 var(--lg-done-bar); }
.ui .ui-table tr.ui-donerow.ui-selected { --ui-row-bg: var(--ui-select-bg); }
.ui .ui-table tr.ui-donerow.ui-selected td:first-child { box-shadow: inset 5px 0 0 var(--ui-select-bar), inset 9px 0 0 var(--lg-done-bar); }
.ui .ui-table tr.lg-deleted td { color: var(--ui-muted); font-style: italic; }

/* 목록-상세: 표를 넓게, 상세는 오른쪽 좁은 칸. 상세가 길면 칸 안에서 스크롤 */
@media (min-width: 1100px) {
  #page-recv.ui .ui-split { grid-template-columns: minmax(0, 1fr) minmax(360px, 400px); }
}
#page-recv.ui .ui-split-detail { max-height: calc(100vh - 24px); overflow: auto; }
@media (max-width: 1099px) { #page-recv.ui .ui-split-detail { max-height: none; } }
#page-recv.ui .ui-split .ui-table { min-width: 640px; }
#page-recv.ui .ui-table td { white-space: nowrap; }
#page-recv.ui .ui-table td.ui-wrap { white-space: normal; }
#page-recv.ui .ui-table td.ui-clip { max-width: 220px; }

.lg-help { margin: 0 0 var(--ui-s3); max-width: 90ch; }
.lg-tabs { margin: 0 0 var(--ui-s3); }
.lg-tabs .ui-seg-item { min-height: 42px; padding: 0 var(--ui-s5); font-size: var(--ui-fs-md); }
.lg-list { align-items: stretch; width: 100%; }
.lg-list > * { width: 100%; }
.lg-tblbox { width: 100%; }
.lg-foot { margin-top: var(--ui-s2); }
.lg-first { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.lg-indent { padding-left: var(--ui-s4); }
.ui .ui-table tr.lg-grp td { background: var(--ui-surface-3); font-weight: 700; }
.ui .ui-table tr.lg-grp:hover td { background: var(--ui-accent-soft); }
.ui .ui-table tr.lg-grp.ui-selected td { background: var(--ui-select-bg); }
.lg-notice { padding: var(--ui-s3) var(--ui-s4); margin-bottom: var(--ui-s3); border: 1px solid var(--ui-line); border-radius: var(--ui-r); background: var(--ui-surface); }

/* 고른 조건 칩 줄 */
.lg-picks { margin: 0 0 var(--ui-s3); }
.lg-pick { display: inline-flex; align-items: center; min-height: 32px; padding: 0 var(--ui-s3); border: 1px solid var(--ui-accent); border-radius: 99px; background: var(--ui-accent-soft); color: var(--ui-accent); font-size: var(--ui-fs-sm); font-weight: 700; cursor: pointer; }
.lg-pick span { margin-left: 8px; }
.lg-pick:hover { filter: brightness(.96); }

/* 비중 막대(숫자와 함께) */
.lg-share { display: inline-flex; align-items: center; gap: var(--ui-s2); justify-content: flex-end; }
.lg-bar { display: inline-block; width: 64px; height: 10px; border-radius: 99px; background: var(--ui-surface-3); border: 1px solid var(--ui-line); overflow: hidden; flex: none; }
.lg-bar > i { display: block; height: 100%; background: var(--lg-bar); }
.lg-pct { min-width: 44px; text-align: right; font-variant-numeric: tabular-nums; }

/* 기간별 막대그래프(눌러서 기간 고르기) */
.lg-chart { display: flex; align-items: flex-end; gap: 4px; overflow-x: auto; padding-bottom: 2px; }
.lg-col { flex: 1 1 0; min-width: 38px; display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 4px 2px 4px; border: 1px solid transparent; border-radius: var(--ui-r-sm); background: transparent; color: var(--ui-text); cursor: pointer; font: inherit; }
.lg-col:hover { background: var(--ui-surface-3); }
.lg-col.lg-on { background: var(--ui-select-bg); border-color: var(--ui-select-bar); }
.lg-val { font-size: var(--ui-fs-xs); font-weight: 700; font-variant-numeric: tabular-nums; color: var(--ui-text); }
.lg-track { display: flex; align-items: flex-end; width: 100%; height: 120px; border-bottom: 2px solid var(--ui-line-strong); }
.lg-track > i { display: block; width: 100%; border-radius: 4px 4px 0 0; background: var(--ui-chart-1); }
.lg-col.lg-cur .lg-track > i { background: repeating-linear-gradient(135deg, var(--ui-chart-1) 0 6px, transparent 6px 10px); outline: 2px solid var(--ui-chart-1); outline-offset: -2px; }
.lg-lab { font-size: var(--ui-fs-xs); color: var(--ui-text-2); white-space: nowrap; }
.lg-lab2 { font-size: var(--ui-fs-xs); color: var(--ui-muted); white-space: pre; min-height: 1.4em; }

/* 오른쪽 상세 */
.lg-detail { align-items: stretch; width: 100%; }
.lg-ptext { flex: 1; min-width: 0; font-weight: 700; overflow-wrap: anywhere; }
.lg-dl { display: grid; grid-template-columns: auto 1fr; gap: 6px var(--ui-s4); margin: 0; width: 100%; }
.lg-dl dt { font-size: var(--ui-fs-sm); color: var(--ui-text-2); font-weight: 700; white-space: nowrap; }
.lg-dl dd { margin: 0; text-align: right; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.lg-mini { width: 100%; display: flex; flex-direction: column; gap: 2px; }
.lg-minirow { display: grid; grid-template-columns: minmax(0, 1fr) 70px auto; align-items: center; gap: var(--ui-s2); width: 100%; min-height: 34px; padding: 2px var(--ui-s2); border: 0; border-radius: var(--ui-r-sm); background: transparent; color: var(--ui-text); font-size: var(--ui-fs-sm); text-align: left; cursor: pointer; }
.lg-minirow:hover { background: var(--ui-accent-soft); }
.lg-minirow .lg-bar { width: 70px; }
.lg-mini-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lg-mini-val { min-width: 56px; }

/* 미수금 상세 */
.rv-form { align-items: stretch; width: 100%; gap: var(--ui-s3); }
.rv-form .ui-field { margin-bottom: 0; }
.rv-form .ui-seg { display: flex; width: 100%; }
.rv-form .ui-seg-item { flex: 1; min-height: 42px; }
.rv-two { display: grid; grid-template-columns: 1fr 1fr; gap: var(--ui-s3); }
.rv-two .ui-field { min-width: 0; }
.rv-head { align-items: flex-start; gap: var(--ui-s2); }
.rv-cust { font-size: var(--ui-fs-lg); font-weight: 800; overflow-wrap: anywhere; }
.rv-amt { font-size: var(--ui-fs-xl); font-weight: 800; font-variant-numeric: tabular-nums; }
.rv-log { align-items: stretch; width: 100%; gap: var(--ui-s2); padding-top: var(--ui-s3); border-top: 1px solid var(--ui-line); }
.rv-logrow { display: flex; flex-direction: column; font-size: var(--ui-fs-sm); }
.rv-diff { padding: var(--ui-s3) var(--ui-s4); margin-bottom: var(--ui-s3); }
.rv-sum { cursor: pointer; font-size: var(--ui-fs); }
.rv-diffbody { align-items: stretch; margin-top: var(--ui-s3); gap: var(--ui-s2); font-size: var(--ui-fs-sm); }

/* 필터 바 검색칸: 공통 .ui-input 의 가로 100% 를 막고 알맞은 폭으로 */
.ui .ui-filterbar .ui-search { width: 280px; flex: none; }

@media (min-width: 1600px) {
  #page-recv.ui .ui-split { grid-template-columns: minmax(0, 1fr) minmax(380px, 440px); }
  .lg-bar { width: 90px; }
}

/* 미수금: 요약 카드 6개를 한 줄로, 좁은 화면(1600 미만)에서는 부가 열(표시·메모)을 감추고 상세 패널에서 본다 */
@media (min-width: 1100px) { #page-recv.ui .ui-kpis { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
@media (max-width: 1599px) { #page-recv.ui .rv-wide { display: none; } }
#page-recv.ui .ui-table td.ui-wrap { min-width: 150px; }
#page-recv.ui .ui-table th, #page-recv.ui .ui-table td { padding-left: 8px; padding-right: 8px; }
#page-recv.ui .ui-table th.ui-num { white-space: normal; line-height: 1.25; }
#page-recv.ui .ui-table th.ui-num { min-width: 96px; }

/* 미수금: 이카운트에만 있음 탭 */
@media (min-width: 1100px) { #page-recv.ui .ui-kpis.rv-gapkpis { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.rv-gapitems { align-items: stretch; width: 100%; gap: var(--ui-s2); padding-top: var(--ui-s3); border-top: 1px solid var(--ui-line); }
.rv-gapitem { font-size: var(--ui-fs-sm); overflow-wrap: anywhere; }
.rv-gapwarn { display: flex; align-items: flex-start; flex-wrap: wrap; gap: var(--ui-s2); padding: var(--ui-s3); border-left: 5px solid var(--ui-warn-bar); border-radius: var(--ui-r-sm); background: var(--ui-warn-bg); font-weight: 600; }
.rv-gapnear { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; gap: var(--ui-s2); align-items: baseline; font-size: var(--ui-fs-sm); padding: 4px var(--ui-s2); border-radius: var(--ui-r-sm); background: var(--ui-warn-bg); }
.rv-gapnear b { font-variant-numeric: tabular-nums; text-align: right; }
@media (max-width: 1599px) { #page-recv.ui .ui-split .ui-table { min-width: 0; } }
.rv-big { font-size: var(--ui-fs-lg); font-weight: 800; margin: 0 0 var(--ui-s2); }

/* 미수금: 이카운트 대조 탭(월별 대조 · 미수금에만 있음) */
.rv-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.rv-mcell { display: flex; flex-direction: column; gap: 2px; white-space: nowrap; }
.rv-only-s { display: none; font-size: var(--ui-fs-sm); color: var(--ui-text-2); font-weight: 500; white-space: normal; }
@media (min-width: 1100px) { #page-recv.ui .ui-kpis.rv-reckpis { grid-template-columns: repeat(4, minmax(0, 1fr)); } #page-recv.ui .ui-kpis.rv-orphkpis { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
#page-recv.ui .rv-tbl { min-width: 0; }
#page-recv.ui .rv-tbl td, #page-recv.ui .rv-tbl th { padding-left: 10px; padding-right: 10px; }
.rv-msel { gap: 6px; }
.ui .ui-input.rv-msel-input { width: auto; min-width: 170px; min-height: 36px; color-scheme: light dark; }
:root[data-theme="dark"] .ui .ui-input.rv-msel-input { color-scheme: dark; }
:root[data-theme="light"] .ui .ui-input.rv-msel-input { color-scheme: light; }
.rv-bulk { align-items: center; gap: var(--ui-s3); padding: var(--ui-s2) var(--ui-s3); margin-bottom: var(--ui-s2); border: 1px solid var(--ui-line); border-radius: var(--ui-r); background: var(--ui-surface-2); }
.rv-bulkinfo { flex: 1 1 220px; font-size: var(--ui-fs-sm); font-weight: 700; color: var(--ui-text); }
.rv-chk, .rv-chkall { width: 20px; height: 20px; cursor: pointer; accent-color: var(--ui-accent); }
#page-recv.ui .ui-table th.rv-chkcol, #page-recv.ui .ui-table td:has(> .rv-chk) { width: 36px; padding-left: 8px; padding-right: 0; }
.rv-custcell { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.rv-opts { display: flex; flex-direction: column; gap: var(--ui-s2); }
.rv-opt { display: flex; align-items: flex-start; gap: var(--ui-s3); padding: var(--ui-s3); border: 1px solid var(--ui-line-strong); border-radius: var(--ui-r-sm); background: var(--ui-surface); cursor: pointer; }
.rv-opt:hover { background: var(--ui-accent-soft); }
.rv-opt.rv-on { border-color: var(--ui-select-bar); background: var(--ui-select-bg); box-shadow: inset 5px 0 0 var(--ui-select-bar); }
.rv-opt.rv-off { opacity: 1; cursor: not-allowed; background: var(--ui-surface-2); }
.rv-opt input { width: 20px; height: 20px; margin-top: 2px; flex: none; accent-color: var(--ui-accent); }
.rv-optbody { display: flex; flex-direction: column; gap: 4px; min-width: 0; font-size: var(--ui-fs-sm); overflow-wrap: anywhere; }
.rv-optsub { font-size: var(--ui-fs-sm); color: var(--ui-text-2); font-variant-numeric: tabular-nums; }
.rv-sumbox { padding: var(--ui-s3); border: 1px dashed var(--ui-line-strong); border-radius: var(--ui-r-sm); font-size: var(--ui-fs-sm); background: var(--ui-surface-2); }
@media (max-width: 899px) {
  .rv-only-s { display: block; }
  #page-recv.ui .rv-hide-s { display: none; }
  #page-recv.ui .ui-table td.ui-wrap { min-width: 0; }
  .rv-mcell { white-space: normal; }
}
@media (max-width: 899px) {
  #page-recv.ui .lg-tabs .ui-seg { flex-wrap: wrap; }
  #page-recv.ui .lg-tabs .ui-seg-item { min-height: 40px; padding: 0 var(--ui-s3); }
  #page-recv.ui .rv-bulk .ui-btn { white-space: normal; }
}
/* 폰 폭: 월별 대조표는 줄마다 카드처럼 쌓는다(가로 스크롤 없이 월·차이·이유가 다 보이게) */
@media (max-width: 899px) {
  #page-recv.ui .rv-tbl thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  #page-recv.ui .rv-tbl, #page-recv.ui .rv-tbl tbody, #page-recv.ui .rv-tbl tfoot, #page-recv.ui .rv-tbl tr, #page-recv.ui .rv-tbl td { display: block; width: auto; }
  #page-recv.ui .rv-tbl tr { padding: 10px 12px; border-bottom: 1px solid var(--ui-line); background: var(--ui-row-bg, var(--ui-surface)); }
  #page-recv.ui .rv-tbl td { height: auto; padding: 3px 0; border: 0; text-align: left; background: transparent; }
  #page-recv.ui .rv-tbl td.ui-num::before { content: "차이(원) "; font-weight: 600; color: var(--ui-text-2); }
  #page-recv.ui .rv-tbl td:first-child { position: static; box-shadow: none; }
  #page-recv.ui .rv-tbl tfoot .ui-total td { position: static; }
  #page-recv.ui .rv-tbl tr.ui-total { background: var(--ui-surface-3); }
  .rv-chips { gap: 6px; }
}
@media (max-width: 899px) { #page-recv.ui .rv-tbl td.rv-hide-s { display: none; } }

/* ===== 미수금 목록 다듬기(2026-10-04): 한 화면에 많이 · 일반 업체 / 지앤케이솔루션(총판) 두 덩어리 · 진행 칸 색 =====
   바꾸는 것은 #page-recv 안에서만(매출 화면과 같은 규칙은 위쪽 그대로). 색은 --ps-* 토큰만. */
/* 위쪽 띠를 낮게: 제목 줄 · 기준 줄 · 월 줄 · 요약 띠 */
#page-recv.ui.ps-page .ui-head { padding-bottom: 4px; }
#page-recv.ui.ps-page .ui-head .ui-btn, #page-recv.ui.ps-page .ui-head .ps-search { min-height: 32px; }
#page-recv.ui.ps-page .ps-livebar { padding: 4px 0; margin-bottom: 6px; gap: 6px 20px; }
#page-recv.ui.ps-page .ps-livebar .ui-btn { min-height: 26px; }
#page-recv.ui.ps-page .rv-mbar { margin: 0 0 6px; gap: 6px 16px; }
#page-recv.ui.ps-page .rv-mchip { min-height: 30px; min-width: 42px; }
#page-recv.ui.ps-page .rv-mnav .ui-btn { min-height: 30px; }
#page-recv.ui.ps-page .rv-mright { margin-left: auto; display: flex; align-items: center; flex-wrap: wrap; gap: 6px 14px; }
#page-recv.ui.ps-page .rv-mright .ui-seg-item { min-height: 30px; }
#page-recv.ui.ps-page .mx-kpis.rv-kcompact { margin-bottom: 8px; }
#page-recv.ui.ps-page .mx-kpis.rv-kcompact .mx-kpi { padding: 0 16px 6px; }
#page-recv.ui.ps-page .mx-kpis.rv-kcompact .mx-kmain { margin: 0; }
#page-recv.ui.ps-page .mx-kpis.rv-kcompact .mx-kv { font-size: 28px; }
#page-recv.ui.ps-page .mx-kpis.rv-kcompact .mx-kn ~ .mx-kn { display: none; }
#page-recv.ui.ps-page .mx-sidet { margin-bottom: 2px; }
#page-recv.ui.ps-page .ps-tpick { min-height: 28px; padding-top: 1px; padding-bottom: 1px; }

/* 목록 표: 두 덩어리는 넓으면(1800 이상) 시트처럼 좌우, 좁으면 위아래. 좌우일 때는 각자 안에서만 스크롤 */
#page-recv.ui.ps-page .mx-tablebox.rv-ownbox { display: flex; flex-direction: column; overflow: hidden; }
#page-recv.ui.ps-page .rv-owners { flex: 1 1 0; min-height: 0; display: flex; flex-direction: column; gap: 14px; overflow-y: auto; overflow-x: hidden; scrollbar-width: thin; }
#page-recv.ui.ps-page .rv-owners > .ps-wrap { flex: none; height: auto; max-height: none; overflow: visible; }
#page-recv.ui.ps-page .rv-owners > .rv-own { flex: none; }
@media (min-width: 1840px) {
  #page-recv.ui.ps-page .rv-owners { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 12px; overflow: hidden; }
  #page-recv.ui.ps-page .rv-owners > .ps-wrap, #page-recv.ui.ps-page .rv-owners > .rv-own { height: 100%; min-height: 0; overflow-x: hidden; overflow-y: auto; scrollbar-width: thin; }
}
#page-recv.ui.ps-page .rv-owners > .rv-own-empty { height: auto; align-self: start; width: 100%; }
@media (max-width: 899px) { #page-recv.ui.ps-page .rv-owners { overflow: visible; } }
#page-recv.ui.ps-page .rv-owners .ps-cat { margin-top: 10px; }
#page-recv.ui.ps-page .rv-owners .ps-c { padding-top: 6px; padding-bottom: 6px; }
#page-recv.ui.ps-page .rv-owners .ps-catcell { padding-top: 0; padding-bottom: 0; }
#page-recv.ui.ps-page .rv-owners .ps-catname { white-space: pre-line; font-size: 13px; }
#page-recv.ui.ps-page .rv-owners .ps-hgroup .ps-gh { word-spacing: normal; letter-spacing: normal; }
#page-recv.ui.ps-page .rv-owners .ps-hgroup .ps-gh:first-child { font-size: 14px; color: var(--ps-text); }
#page-recv.ui.ps-page .rv-owner b { font-weight: 500; margin-right: 6px; }
#page-recv.ui.ps-page .rv-owner span { font-size: 12px; color: var(--ps-muted); }
#page-recv.ui.ps-page .rv-own-empty { border: 2px solid var(--ps-box); align-self: start; }
#page-recv.ui.ps-page .rv-ownt { display: flex; align-items: baseline; gap: 10px; padding: 8px 12px; border-bottom: 1px solid var(--ps-rule); }
#page-recv.ui.ps-page .rv-ownt b { font-size: 14px; font-weight: 500; }
#page-recv.ui.ps-page .rv-own-empty .ui-empty { border: 0; margin: 0; }
/* 묶음 이름 칸: 왼쪽에 고유색 막대(8색 순환, 색 토큰은 page-palette.css 의 --ps-cat1~8) */
#page-recv.ui.ps-page .ps-cat[data-ci="0"] { --cc: var(--ps-cat1); }
#page-recv.ui.ps-page .ps-cat[data-ci="1"] { --cc: var(--ps-cat2); }
#page-recv.ui.ps-page .ps-cat[data-ci="2"] { --cc: var(--ps-cat3); }
#page-recv.ui.ps-page .ps-cat[data-ci="3"] { --cc: var(--ps-cat4); }
#page-recv.ui.ps-page .ps-cat[data-ci="4"] { --cc: var(--ps-cat5); }
#page-recv.ui.ps-page .ps-cat .ps-catcell { box-shadow: inset 5px 0 0 var(--cc, var(--ps-muted)); }

/* 진행 칸(계산서·결제·발송): 아직이면 '–', 끝난 칸은 칸 전체에 연한 색 + 글자. 정상=초록 · 주의=앰버 · 정보=파랑 */
#page-recv.ui.ps-page .ps-c.rv-nil { color: var(--ps-muted); }
#page-recv.ui.ps-page .ps-c.rv-tint { color: var(--ps-text); font-weight: 500; }
#page-recv.ui.ps-page .ps-c.rv-tint-good { background: color-mix(in srgb, var(--ps-good) 19%, var(--rb, var(--ps-bg))); }
#page-recv.ui.ps-page .ps-c.rv-tint-warn { background: color-mix(in srgb, var(--ps-warnc) 22%, var(--rb, var(--ps-bg))); }
#page-recv.ui.ps-page .ps-c.rv-tint-info { background: color-mix(in srgb, var(--ps-info) 19%, var(--rb, var(--ps-bg))); }

/* ===== 매출(#page-ledger) 숫자 조회 화면 (2026-10-04): 기간 줄 · 큰 숫자 4개 · (연도별·월별) 숫자 목록 · 조회 목록 · 거래 내역 =====
   그래프·막대·히트맵 없음. 색은 --ps-* 토큰만. 표 모양은 page-sales.css 의 ps-* 를 그대로 쓴다. */
#page-ledger.ui.ps-page .lq-nav { display: inline-flex; align-items: center; gap: 6px; }
#page-ledger.ui.ps-page .lq-nav .ui-btn { min-width: 38px; padding: 0 10px; }
#page-ledger.ui.ps-page .lq-pick { width: auto; min-width: 150px; min-height: 38px; font-variant-numeric: tabular-nums; color-scheme: light dark; }
:root[data-theme="dark"] #page-ledger.ui.ps-page .lq-pick, :root[data-theme="dark"] #page-ledger.ui.ps-page .lq-q { color-scheme: dark; }
:root[data-theme="light"] #page-ledger.ui.ps-page .lq-pick, :root[data-theme="light"] #page-ledger.ui.ps-page .lq-q { color-scheme: light; }
#page-ledger.ui.ps-page .lq-wk { font-size: 13px; color: var(--ps-text2); font-variant-numeric: tabular-nums; white-space: nowrap; }
#page-ledger.ui.ps-page .lq-all { font-size: 17px; font-weight: 500; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; padding: 0 4px; }
#page-ledger.ui.ps-page .lq-tog { min-height: 38px; }
#page-ledger.ui.ps-page .ui-actions { gap: 8px 12px; }

/* 큰 숫자 4개 + 아래 작은 비교 한 줄 */
#page-ledger.ui.ps-page .lq-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); }
#page-ledger.ui.ps-page .lq-kpis .mx-kpi { padding: 2px 16px 8px; }
#page-ledger.ui.ps-page .lq-kpis .mx-kpi:first-child { padding-left: 0; }
#page-ledger.ui.ps-page .lq-kpis .mx-kv { font-size: 36px; }
#page-ledger.ui.ps-page .lq-kpis .mx-kpi:first-child .mx-kv { color: var(--ps-ac-ink, var(--ps-text)); }
#page-ledger.ui.ps-page .lq-kpis .mx-kv.lq-zero, #page-ledger.ui.ps-page .lq-zero { color: var(--ps-muted); }
@media (min-width: 900px) and (min-height: 860px) { #page-ledger.ui.ps-page .lq-kpis .mx-kv { font-size: 44px; } #page-ledger.ui.ps-page .lq-kpis .mx-kl { font-size: 13px; } }
#page-ledger.ui.ps-page .lq-cmp { min-height: 16px; font-size: 11.5px; line-height: 1.4; color: var(--ps-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-variant-numeric: tabular-nums; }
#page-ledger.ui.ps-page .lq-up { color: var(--ps-good); font-weight: 500; }
#page-ledger.ui.ps-page .lq-dn { color: var(--ps-bad); font-weight: 500; }
#page-ledger.ui.ps-page .lq-eq { color: var(--ps-text2); }

#page-ledger.ui.ps-page .ps-livebar .ps-fs-item { font-size: 13px; }

/* 본문: [연도별·월별 숫자 목록] [조회 목록] [거래 내역] */
#page-ledger.ui.ps-page .lq-body { flex: 1 1 auto; min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr); column-gap: 16px; }
#page-ledger.ui.ps-page .lq-body.lq-s { grid-template-columns: 276px minmax(0, 1fr); }
#page-ledger.ui.ps-page .lq-body.lq-d { grid-template-columns: minmax(0, 1fr) 340px; }
#page-ledger.ui.ps-page .lq-body.lq-s.lq-d { grid-template-columns: 276px minmax(0, 1fr) 340px; }
@media (min-width: 1600px) {
  #page-ledger.ui.ps-page .lq-body.lq-s { grid-template-columns: 300px minmax(0, 1fr); }
  #page-ledger.ui.ps-page .lq-body.lq-d { grid-template-columns: minmax(0, 1fr) 380px; }
  #page-ledger.ui.ps-page .lq-body.lq-s.lq-d { grid-template-columns: 300px minmax(0, 1fr) 380px; }
}
#page-ledger.ui.ps-page .lq-list { display: flex; flex-direction: column; min-width: 0; min-height: 0; padding-right: 0; }
#page-ledger.ui.ps-page .lq-bar2 { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; flex: none; margin-bottom: 8px; }
#page-ledger.ui.ps-page .lq-q { width: 240px; min-height: 34px; flex: none; }
#page-ledger.ui.ps-page .lq-list .mx-tablebox { flex: 1 1 auto; min-height: 0; }
#page-ledger.ui.ps-page .lq-first { display: flex; align-items: center; gap: 8px; min-width: 0; width: 100%; }
#page-ledger.ui.ps-page .lq-first .ps-nm { flex: 0 1 auto; }
#page-ledger.ui.ps-page .lq-first .mx-tag { flex: none; font-size: 11.5px; gap: 5px; color: var(--ps-text2); }
#page-ledger.ui.ps-page .lq-sub { flex: none; font-size: 11.5px; font-weight: 400; color: var(--ps-muted); white-space: nowrap; }
#page-ledger.ui.ps-page .lq-date { font-variant-numeric: tabular-nums; font-weight: 400; }
#page-ledger.ui.ps-page .ps-c.lq-amt { padding-right: 12px; justify-content: flex-end; }
#page-ledger.ui.ps-page .ps-hc.lq-amt { padding-right: 12px; }
#page-ledger.ui.ps-page .ps-c.ps-code { font-size: 12px; }

/* 연도별·월별 숫자 목록 */
#page-ledger.ui.ps-page .lq-side { min-width: 0; min-height: 0; overflow-y: auto; overflow-x: hidden; scrollbar-width: thin; padding-right: 8px; }
#page-ledger.ui.ps-page .lq-sidet2 { margin-top: 14px; }
#page-ledger.ui.ps-page .lq-prow { display: grid; grid-template-columns: 50px minmax(0, 1fr) 52px 38px; align-items: baseline; column-gap: 6px; width: 100%; padding: 0 2px; font-size: 13px; font-variant-numeric: tabular-nums; text-align: right; }
#page-ledger.ui.ps-page .lq-phead { min-height: 26px; align-items: center; border-top: 2px solid var(--ps-box); border-bottom: 1px solid var(--ps-rule); font-size: 12px; font-weight: 500; color: var(--ps-muted); }
#page-ledger.ui.ps-page .lq-pk { text-align: left; font-weight: 500; }
#page-ledger.ui.ps-page .lq-pbtn { position: relative; padding: 8px 2px 8px 8px; border: 0; border-bottom: 1px solid var(--ps-hair); background: transparent; color: var(--ps-text); font-family: inherit; cursor: pointer; transition: background-color .12s var(--ease-out); }
#page-ledger.ui.ps-page .lq-pbtn.lq-p1 { padding-top: 5px; padding-bottom: 5px; }
#page-ledger.ui.ps-page .lq-pbtn:hover:not(:disabled) { background: var(--ps-raised); }
#page-ledger.ui.ps-page .lq-pbtn.lq-on { background: var(--ps-ac-tint, var(--ps-raised)); box-shadow: inset 3px 0 0 var(--ps-ac, var(--ps-text)); }
#page-ledger.ui.ps-page .lq-pbtn:disabled { cursor: default; color: var(--ps-muted); }
#page-ledger.ui.ps-page .lq-pbtn:focus-visible { outline-offset: -2px; }
#page-ledger.ui.ps-page .lq-pc { grid-column: 1 / -1; text-align: left; font-size: 11px; color: var(--ps-muted); padding-top: 1px; }
#page-ledger.ui.ps-page .lq-pd { white-space: nowrap; }

/* 거래 내역(오른쪽) */
#page-ledger.ui.ps-page .lq-detail { display: flex; flex-direction: column; min-width: 0; min-height: 0; padding-right: 0; border-left: 1px solid var(--ps-hair); padding-left: 16px; }
#page-ledger.ui.ps-page .lq-dhead { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; flex: none; margin-bottom: 6px; }
#page-ledger.ui.ps-page .lq-dtitle { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; min-width: 0; }
#page-ledger.ui.ps-page .lq-dtitle b { font-size: 17px; font-weight: 500; letter-spacing: -0.02em; overflow-wrap: anywhere; word-break: keep-all; }
#page-ledger.ui.ps-page .lq-dtags { display: inline-flex; flex-wrap: wrap; gap: 2px 12px; }
#page-ledger.ui.ps-page .lq-dtags .mx-tag { font-size: 11.5px; }
#page-ledger.ui.ps-page .lq-dbig { display: flex; flex-direction: column; flex: none; }
#page-ledger.ui.ps-page .lq-dbig .lq-dkv { font-size: 26px; font-weight: 400; letter-spacing: -0.035em; line-height: 1.2; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
#page-ledger.ui.ps-page .lq-dks { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); flex: none; margin: 6px 0 8px; border-top: 1px solid var(--ps-hair); border-bottom: 1px solid var(--ps-hair); }
#page-ledger.ui.ps-page .lq-dk { display: flex; flex-direction: column; padding: 6px 8px 6px 0; min-width: 0; }
#page-ledger.ui.ps-page .lq-dk + .lq-dk { padding-left: 10px; border-left: 1px solid var(--ps-hair); }
#page-ledger.ui.ps-page .lq-dkl { font-size: 11.5px; color: var(--ps-muted); }
#page-ledger.ui.ps-page .lq-dk .lq-dkv { font-size: 18px; font-weight: 400; letter-spacing: -0.03em; font-variant-numeric: tabular-nums; }
#page-ledger.ui.ps-page .lq-dtable { flex: 1 1 auto; min-height: 0; }
#page-ledger.ui.ps-page .lq-dtable > .ps-wrap { height: 100%; max-height: none; }
#page-ledger.ui.ps-page .lq-detail .ps-c { font-size: 12.5px; padding-top: 7px; padding-bottom: 7px; cursor: default; }
#page-ledger.ui.ps-page .lq-detail .ps-gh { font-size: 11.5px; }
#page-ledger.ui.ps-page .ps-gh { word-spacing: normal; letter-spacing: normal; font-size: 12px; }

/* 좁은 화면(900 미만): 위에서 아래로 쌓는다 */
@media (max-width: 899px) {
  #page-ledger.ui.ps-page .lq-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #page-ledger.ui.ps-page .lq-kpis .mx-kpi:nth-child(odd) { border-left: 0; padding-left: 0; }
  #page-ledger.ui.ps-page .lq-kpis .mx-kpi:nth-child(n+3) { border-top: 1px solid var(--ps-hair); padding-top: 8px; }
  #page-ledger.ui.ps-page .lq-body, #page-ledger.ui.ps-page .lq-body.lq-s, #page-ledger.ui.ps-page .lq-body.lq-d, #page-ledger.ui.ps-page .lq-body.lq-s.lq-d { display: flex; flex-direction: column; gap: 16px; }
  #page-ledger.ui.ps-page .lq-side { overflow: visible; padding-right: 0; }
  #page-ledger.ui.ps-page .lq-list .mx-tablebox > .ps-wrap, #page-ledger.ui.ps-page .lq-dtable > .ps-wrap { height: auto; max-height: 70vh; }
  #page-ledger.ui.ps-page .lq-detail { border-left: 0; padding-left: 0; border-top: 2px solid var(--ps-box); padding-top: 10px; }
  #page-ledger.ui.ps-page .lq-q { width: 100%; }
  #page-ledger.ui.ps-page .lq-cmp { white-space: normal; }
  #page-ledger.ui.ps-page .lq-nav { flex-wrap: wrap; }
}

/* ===== 미수금 폰 폭(600 이하, 2026-10-04): 월 칩 줄바꿈 · KPI 두 칸씩 · 페이지 가로 넘침 0. 데스크톱 불변 ===== */
@media (max-width: 600px) {
  #page-recv.ui.ps-page { max-width: 100%; overflow-x: clip; }
  #page-recv.ui.ps-page .rv-mbar { min-width: 0; }
  #page-recv.ui.ps-page .rv-mnav { flex-wrap: wrap; }
  #page-recv.ui.ps-page .rv-mchips { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); width: 100%; box-sizing: border-box; }
  #page-recv.ui.ps-page .rv-mchip { min-width: 0; padding: 0 2px; }
  #page-recv.ui.ps-page .rv-mchip:nth-child(7) { border-left: 0; }
  #page-recv.ui.ps-page .rv-mchip:nth-child(n+7) { border-top: 1px solid var(--ps-hair); }
  #page-recv.ui.ps-page .rv-mright { margin-left: 0; width: 100%; }
  #page-recv.ui.ps-page .mx-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #page-recv.ui.ps-page .mx-kpis .mx-kpi { padding: 6px 12px 8px; border-left: 1px solid var(--ps-hair); border-top: 1px solid var(--ps-hair); overflow: hidden; }
  #page-recv.ui.ps-page .mx-kpis .mx-kpi:nth-child(odd) { border-left: 0; padding-left: 0; }
  #page-recv.ui.ps-page .mx-kpis .mx-kpi:nth-child(-n+2) { border-top: 0; }
  #page-recv.ui.ps-page .mx-kpis .mx-kmain { flex-wrap: wrap; white-space: normal; gap: 0 6px; }
  #page-recv.ui.ps-page .mx-kpis .mx-kv, #page-recv.ui.ps-page .mx-kpis.rv-kcompact .mx-kv { font-size: 26px; }
  #page-recv.ui.ps-page .mx-kpis .mx-kn { white-space: normal; }
}