@charset "utf-8";

/* LEDGER · 清单账目风 —— 无海报网格，全站紧凑行列表、斑马纹、等宽数字右对齐 */

:root {
    --acc: #15803d;
    --acc-w: #e8f4ec;
    --sheet: #ffffff;
    --zebra: #fafbfc;
    --grid: #e6e8ec;
    --ink: #16181c;
    --note: #59606c;
    --faint: #969ca7;
    --m: 14px;
}

:is([data-v="b" i],[data-v="f" i],[data-v="j" i],[data-v="n" i],[data-v="r" i],[data-v="v" i]) { --acc: #b45309; --acc-w: #fdf2e3; }
:is([data-v="c" i],[data-v="g" i],[data-v="k" i],[data-v="o" i],[data-v="s" i],[data-v="w" i]) { --acc: #1e40af; --acc-w: #eaeffb; }

*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; background: var(--zebra); }

body {
    font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", -apple-system, Arial, sans-serif;
    font-size: 14px; line-height: 1.55; color: var(--ink);
    background: var(--sheet); max-width: 780px; margin: 0 auto;
    border-left: 1px solid var(--grid); border-right: 1px solid var(--grid);
}

img { display: block; border: 0; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; border: 0; background: none; cursor: pointer; }
.stow { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); opacity: 0; }

/* 骨架：源码 page → idx → hd → ft */
.book { display: grid; grid-template-columns: minmax(0,1fr); grid-template-areas: "hd" "idx" "page" "ft"; min-height: 100vh; }
.book-hd { grid-area: hd; }
.book-idx { grid-area: idx; }
.book-page { grid-area: page; }
.book-ft { grid-area: ft; }

.book-hd { display: flex; align-items: center; gap: 10px; padding: 12px var(--m); background: var(--zebra); border-bottom: 2px solid var(--acc); }
.hd-name img { height: 31px; width: auto; }
.grab { flex: 1 1 auto; display: flex; min-width: 0; height: 33px; border: 1px solid var(--grid); }
.grab-i { flex: 1 1 auto; min-width: 0; padding: 0 9px; font-size: 13px; color: var(--ink); background: var(--zebra); border: 0; outline: 0; }
.grab-i::placeholder { color: var(--faint); }
.grab-b { flex: 0 0 auto; padding: 0 14px; font-size: 13px; font-weight: 600; color: #fff; background: var(--acc); }

.book-idx { padding: 7px var(--m); border-bottom: 1px solid var(--grid); overflow-x: auto; white-space: nowrap; scrollbar-width: none; }
.book-idx::-webkit-scrollbar { display: none; }
.idx-a { display: inline-block; padding: 3px 9px; font-size: 12.5px; color: var(--note); }
.idx-a:hover { color: var(--acc); }
.idx-a--cur { font-weight: 700; color: var(--acc); border-bottom: 2px solid var(--acc); }

.head-line { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 13px var(--m) 7px; background: var(--zebra); border-bottom: 1px solid var(--grid); }
.head-t { font-size: 14.5px; font-weight: 800; letter-spacing: .5px; }
.head-t::before { content: "▍"; margin-right: 2px; color: var(--acc); }
.head-a { font-size: 12px; color: var(--faint); }
.head-a:hover { color: var(--acc); }

/* 清单：紧凑行 + 斑马纹 + 等宽数字列 */
.entries { counter-reset: ent; }
.entry {
    counter-increment: ent;
    display: grid;
    grid-template-columns: 28px 44px minmax(0,1fr) auto;
    align-items: center; gap: 10px;
    padding: 8px var(--m);
    border-bottom: 1px solid var(--grid);
}
.entry:nth-child(even) { background: var(--zebra); }
.entry:hover { background: var(--acc-w); }
.entry-no { font-size: 12px; font-variant-numeric: tabular-nums; text-align: right; color: var(--faint); }
.entry-no::before { content: counter(ent); }
.entry-pic { width: 44px; aspect-ratio: 2 / 3; overflow: hidden; background: var(--zebra) url("../img/load.gif") center / 26px 26px no-repeat; }
.entry-pic img { width: 100%; height: 100%; object-fit: cover; }
.entry-main { min-width: 0; }
.entry-t { display: block; font-size: 13.5px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.entry-x { display: block; font-size: 11px; color: var(--faint); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.entry-val { font-size: 14px; font-weight: 800; font-variant-numeric: tabular-nums; color: var(--acc); }

.jump { display: flex; flex-wrap: wrap; justify-content: center; gap: 5px; padding: 14px var(--m) 18px; }
.jump-b { min-width: 34px; height: 32px; padding: 0 11px; display: inline-flex; align-items: center; justify-content: center; font-size: 13px; font-variant-numeric: tabular-nums; color: var(--note); border: 1px solid var(--grid); }
.jump-b:hover, .jump-b--top { color: #fff; background: var(--acc); border-color: var(--acc); }

/* 详情：账目表 */
.record { display: grid; grid-template-columns: minmax(0,1fr); grid-template-areas: "head" "table" "ops" "note"; }
.rec-head { grid-area: head; display: flex; gap: 12px; padding: 14px var(--m); background: var(--zebra); border-bottom: 2px solid var(--acc); }
.rec-pic { flex: 0 0 96px; aspect-ratio: 2 / 3; overflow: hidden; background: var(--sheet) url("../img/load.gif") center / 30px 30px no-repeat; border: 1px solid var(--grid); }
.rec-pic img { width: 100%; height: 100%; object-fit: cover; }
.rec-body { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; justify-content: center; }
.rec-h1 { font-size: clamp(17px, 5vw, 23px); font-weight: 800; line-height: 1.3; }
.rec-line { margin-top: 5px; font-size: 12.5px; color: var(--note); }
.rec-big { margin-top: 8px; font-size: 26px; font-weight: 900; font-variant-numeric: tabular-nums; line-height: 1; color: var(--acc); }
.rec-big small { font-size: 12px; font-weight: 600; color: var(--faint); }

.rec-table { grid-area: table; }
.tr { display: grid; grid-template-columns: 72px minmax(0,1fr); font-size: 12.5px; border-bottom: 1px solid var(--grid); }
.tr:nth-child(odd) { background: var(--zebra); }
.td-k { padding: 8px 10px; color: var(--faint); border-right: 1px solid var(--grid); }
.td-v { padding: 8px 10px; min-width: 0; color: var(--note); }
.td-v a { color: var(--acc); }

.rec-ops { grid-area: ops; display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); }
.ops-a, .ops-b { min-height: 46px; display: inline-flex; align-items: center; justify-content: center; font-size: 15px; font-weight: 700; }
.ops-a { color: #fff; background: var(--acc); }
.ops-b { color: var(--acc); background: var(--acc-w); }

.rec-note { grid-area: note; padding: 15px var(--m) 4px; }
.note-t { margin-bottom: 8px; font-size: 14.5px; font-weight: 800; }
.note-t::before { content: "▍"; margin-right: 2px; color: var(--acc); }
.note-x { margin-bottom: 9px; font-size: 13.5px; line-height: 1.9; color: var(--note); }
.note-x strong { color: var(--ink); }

.refs { display: flex; flex-wrap: wrap; gap: 5px; padding: 4px var(--m) 16px; }
.ref-a { max-width: 100%; padding: 3px 8px; font-size: 12px; color: var(--note); background: var(--zebra); border: 1px solid var(--grid); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ref-a:hover { color: var(--acc); background: var(--acc-w); border-color: var(--acc); }

.book-ft { margin-top: 12px; padding: 15px var(--m) 22px; background: var(--zebra); border-top: 2px solid var(--acc); }
.ft-fr { margin-bottom: 11px; padding-bottom: 11px; border-bottom: 1px solid var(--grid); font-size: 12px; text-align: center; color: var(--faint); }
.ft-fr b { display: block; margin-bottom: 6px; font-size: 13px; color: var(--ink); }
.ft-fr a { display: inline-block; margin: 2px 7px; color: var(--note); }
.ft-fr a:hover { color: var(--acc); }
.ft-tx { font-size: 11.5px; line-height: 1.85; color: var(--faint); text-align: center; }
.ft-cp { margin-top: 10px; font-size: 11.5px; color: var(--faint); text-align: center; }
.ft-cp a { margin: 0 5px; }
.ft-cp a:hover { color: var(--acc); }