/* Quiet cards, 8px rhythm, Inter labels and tabular financial amounts. */
.of-finance{--of-paper:var(--bg-card,#fff);--of-line:var(--border-color,#e6e1db);--of-ink:var(--text-main,#172b3a);--of-muted:var(--text-muted,#67798b);--of-orange:#f56322;--of-green:#17a754;--of-teal:#00a0aa;display:grid;gap:24px;font:14px Inter,system-ui,sans-serif;color:var(--of-ink)}
.of-finance *{box-sizing:border-box}.of-finance .of-card{background:var(--of-paper);border:1px solid var(--of-line);border-radius:14px;padding:24px;min-width:0;box-shadow:0 1px 1px #00000008}.of-finance h3{font:600 16px Inter,sans-serif;letter-spacing:-.3px;margin:0}.of-finance h4{font:600 14px Inter,sans-serif;margin:0}.of-finance p{font:13px/1.5 Inter,sans-serif;margin:6px 0 0;color:var(--of-muted)}.of-finance strong{font-variant-numeric:tabular-nums}.of-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:20px}.of-heading>strong{font-size:21px}.of-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:24px}.of-metrics>div{padding:12px 0}.of-metrics span,.of-metrics small{display:block;color:var(--of-muted);font-size:11px}.of-metrics strong{display:block;font-size:23px;margin:8px 0}.of-metrics .of-balance{background:color-mix(in srgb,var(--of-green) 9%,var(--of-paper));padding:12px 16px;border-radius:11px}.of-bar-label{display:flex;justify-content:space-between;gap:16px;font-size:11px;color:var(--of-muted);margin:16px 0 7px}.of-track{height:8px;background:var(--bg-muted,#f2f0ed);border-radius:8px;overflow:hidden}.of-track i{display:block;height:100%;border-radius:8px;background:var(--of-green)}.of-track .orange{background:var(--of-orange)}.of-track .teal{background:var(--of-teal)}.of-finance .of-note{padding:9px 12px;background:var(--bg-muted,#f4f2ef);border:1px solid var(--of-line);border-radius:7px;margin-top:16px;font-size:12px}
.of-finance button{font:500 13px Inter,sans-serif;border:1px solid var(--of-line);background:var(--of-paper);color:var(--of-ink);padding:8px 12px;border-radius:7px;cursor:pointer}.of-finance button:hover{border-color:var(--of-orange)}.of-finance button:focus-visible,.of-finance input:focus-visible,.of-finance select:focus-visible{outline:2px solid var(--of-orange);outline-offset:2px}.of-finance button:disabled{opacity:.5;cursor:not-allowed}.of-tabs{display:flex;justify-self:start;gap:4px;border:1px solid var(--of-line);border-radius:11px;padding:4px;background:var(--of-paper)}.of-tabs button{border:0}.of-tabs .active,.of-finance .of-primary{background:var(--of-orange);color:white;border-color:var(--of-orange);font-weight:600}.of-finance .of-new{width:100%;padding:17px;border-style:dashed;border-radius:12px;font-weight:600}.of-caption{margin:0}.of-fields{display:grid;grid-template-columns:1fr 1fr 1.5fr 1fr;gap:12px}.of-fields.income{grid-template-columns:180px 1fr 180px}.of-finance label{font:12px Inter,sans-serif;letter-spacing:0;text-transform:none;color:var(--of-ink);display:grid;gap:8px}.of-finance input:not([type=checkbox]):not([type=range]),.of-finance select{width:100%;min-width:0;padding:9px 12px;min-height:36px;border:1px solid var(--of-line);border-radius:7px;background:var(--of-paper);color:var(--of-ink);font:13px Inter,sans-serif}.of-finance input[type=checkbox]{accent-color:var(--of-orange);width:14px;height:14px;margin:0}.of-receipts{border:0;padding:0;margin:24px 0;display:flex;gap:16px}.of-receipts legend{font-size:12px;margin-bottom:12px}.of-finance .of-receipts label,.of-finance .of-unassigned{display:flex;align-items:center;gap:8px}.of-details{margin:16px 0;color:var(--of-muted);font-size:12px}.of-details summary{cursor:pointer;padding:8px 0}.of-details .of-fields{margin-top:12px}.of-distribution{border-top:1px solid var(--of-line);margin-top:20px;padding-top:20px}.of-split{display:grid;grid-template-columns:minmax(240px,1fr) minmax(90px,180px) 120px 80px 36px;align-items:center;gap:12px;padding:12px;background:var(--bg-muted,#f6f4f1);border:1px solid var(--of-line);border-radius:10px;margin-bottom:10px}.of-finance .of-inline{display:flex;align-items:center;gap:4px}.of-finance input[type=range]{width:100%;accent-color:var(--of-orange)}.of-picker{position:relative;min-width:0}.of-picker>button{display:flex;justify-content:space-between;width:100%;text-align:left;gap:12px;min-height:36px}.of-options{position:absolute;top:calc(100% + 6px);left:0;width:max(100%,min(700px,75vw));z-index:30;background:var(--of-paper);border:1px solid var(--of-line);padding:8px;border-radius:10px;box-shadow:0 8px 24px #0002}.of-options[hidden],.of-options button[hidden]{display:none}.of-options-list{max-height:300px;overflow:auto}.of-options-list button{display:block;border:0;width:100%;text-align:left;padding:10px 12px}.of-options-list button:hover{background:var(--bg-muted)}.of-options small{display:block;color:var(--of-muted);font-size:11px;margin:4px 0}.of-options b{font-size:12px}.of-finance .of-unassigned{margin:16px 0}.of-status{padding:16px;background:color-mix(in srgb,#ffb829 17%,var(--of-paper));border-radius:8px;font-size:12px}.of-status.complete{background:color-mix(in srgb,var(--of-green) 12%,var(--of-paper))}.of-actions{display:flex;justify-content:flex-end;gap:10px;padding-top:16px;border-top:1px solid var(--of-line);margin-top:20px}.of-finance .of-error{color:var(--color-danger,#d03030)}.of-filter{margin-bottom:8px}.of-record{display:flex;justify-content:space-between;gap:24px;padding:20px 0;border-bottom:1px solid var(--of-line)}.of-record:last-child{border:0;padding-bottom:0}.of-record-main{display:flex;gap:14px;min-width:0}.of-record-main b{font-size:14px;font-weight:500;overflow-wrap:anywhere}.of-record-value{text-align:right;flex-shrink:0}.of-record-value small{display:block;color:var(--of-muted);font-size:11px;margin:6px 0}.of-record-value button{font-size:11px;padding:5px 8px;margin-left:4px}.of-green{color:var(--of-green)}.of-income-icon{display:grid;place-items:center;width:40px;height:40px;border-radius:10px;background:color-mix(in srgb,var(--of-green) 12%,var(--of-paper));color:var(--of-green);font-size:23px}.of-badges{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px}.of-badges span{font-size:10px;padding:3px 8px;border:1px solid var(--of-line);border-radius:12px}.of-empty{padding:24px 0}
@media(max-width:1000px){.of-fields{grid-template-columns:1fr 1fr}.of-split{grid-template-columns:1fr 100px 75px 32px}.of-picker{grid-column:1/-1}.of-metrics{grid-template-columns:1fr 1fr}.of-fields.income{grid-template-columns:1fr 2fr}.of-fields.income label:last-child{grid-column:1/-1}}@media(max-width:600px){.of-finance .of-card{padding:16px}.of-finance{gap:16px}.of-metrics strong{font-size:19px}.of-heading{flex-wrap:wrap}.of-fields,.of-fields.income{grid-template-columns:1fr}.of-record{gap:12px}.of-record-value strong{font-size:13px}.of-split{gap:8px;grid-template-columns:minmax(40px,1fr) 85px 65px 30px}.of-options{width:100%}}@media print{.of-form,.of-tabs,.of-new,.of-record-value button{display:none!important}.of-card{break-inside:avoid}}

[data-theme="light"] .of-finance{--of-paper:#fff;--of-line:#e6e1db;--of-ink:#172b3a;--of-muted:#657487;--bg-muted:#f5f3f0}.of-finance h3,.of-finance h4,.of-finance .of-heading>strong,.of-finance .of-metrics strong,.of-finance .of-record-main b{color:var(--of-ink)}.of-finance .of-split [data-part="percent"]{padding:8px 3px;font-size:11px}.of-finance .of-split input[type="number"]{appearance:textfield;-moz-appearance:textfield}.of-finance .of-split input::-webkit-inner-spin-button{appearance:none}
html .of-finance h3,html .of-finance h4{color:var(--of-ink)!important}

.of-metrics{grid-template-columns:repeat(5,minmax(0,1fr))}.of-metrics strong{font-size:21px}.of-indirect{display:grid;grid-template-columns:1fr auto auto;gap:24px;align-items:center}.of-indirect small,.of-indirect strong{display:block;text-align:right}.of-indirect small{font-size:11px;color:var(--of-muted);margin-bottom:8px}.of-utility-summary{display:flex;flex-wrap:wrap;align-items:center;gap:20px;font-size:13px}.of-finance .of-withdraw{margin-top:16px;border:0;color:var(--of-orange);padding-left:0}.of-indirect button{color:var(--of-orange);margin-top:6px}@media(max-width:1100px){.of-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:700px){.of-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.of-indirect{grid-template-columns:1fr 1fr}.of-indirect>div:first-child{grid-column:1/-1}}
