.modal-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.modal-title h2{margin:0}.close{width:34px;height:34px;border:0;border-radius:8px;background:#e8eddf;color:#51683d;font-size:25px;line-height:1}@media(max-width:760px){dialog{width:100%;max-width:none;min-height:100dvh;border-radius:0;margin:0}.modal{min-height:100dvh;padding:20px 14px 96px}.modal-actions{position:fixed;left:14px;right:14px;bottom:16px}.modal-actions .primary{flex:1}.modal-actions .secondary{display:none}}
.tabs{display:flex;gap:6px;overflow:auto;padding:14px 16px 0}.tabs button{border:0;border-radius:18px;padding:8px 12px;background:#e8eddf;color:#486139;white-space:nowrap}.tabs button.active{background:#51683d;color:white}
.back-page{border:0;background:#e8eddf;color:#51683d;border-radius:8px;width:34px;height:34px;margin:0 0 9px;font-size:22px;line-height:1}
.home-expense-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.home-expense-actions a,.expense-sheet-link{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;padding:10px 14px;border-radius:8px;font-size:12px}.expense-actions{flex-wrap:wrap}

/* Expense-only rules: type and controls follow the approved local design pages. */
.expenses-screen{--paper:#fffdf8;--sage:#e6eddd;--line:#dbe3d3;--green:#536b3f;max-width:900px}
.expenses-screen .top{align-items:center}.expenses-screen .top>div{display:flex;align-items:center;gap:10px}
.expenses-screen .top .eyebrow{display:none}.expenses-screen h1{font:400 28px Georgia,serif}
.expenses-screen .back-page{margin:0;width:33px;height:33px;border-radius:10px;font-size:21px}
.expenses-screen .top .primary{min-height:36px;padding:0 11px;font-size:12px;white-space:nowrap;border-radius:9px}
.expense-page .metric-grid{grid-template-columns:repeat(2,minmax(0,1fr));margin:18px 0;gap:10px}
.expense-page .metric{padding:14px}.expense-page .metric strong{font-size:26px;overflow-wrap:anywhere}
.expense-page .panel-head{gap:12px;padding:12px 13px}.expense-page .panel-head h2{font-size:19px}
.expense-page .panel-head>span{font-size:11px;text-align:right}.expense-page .filters{padding:10px 13px}
.expense-page .filters input{width:100%;min-width:0;height:40px;background:var(--paper);font-size:11px}
.expense-page .tabs{padding:12px 13px 0;gap:6px}.expense-page .tabs button{border:1px solid var(--line);border-radius:13px;padding:6px 9px;background:var(--paper);font-size:10px}
.expense-page .tabs button.active{background:var(--sage);border-color:var(--green);color:var(--green)}
.expense-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;align-items:center;gap:8px;padding:13px;border-bottom:1px solid var(--line)}
.expense-row:last-child{border-bottom:0}.expense-row>div{min-width:0}.expense-row>strong{font-size:12px;white-space:nowrap}
.expense-name{border:0;padding:0;background:none;color:var(--ink);font:400 18px Georgia,serif;text-align:left;overflow-wrap:anywhere}
.expense-row small{display:block;margin-top:5px;color:var(--muted);font-size:10px;overflow-wrap:anywhere}
.expense-row .link{min-height:29px;border:1px solid var(--line);border-radius:6px;text-decoration:none;font-size:10px;padding:5px 8px}
.expense-dialog{--paper:#fffdf8;--sage:#e6eddd;--line:#dbe3d3;--green:#536b3f;max-height:calc(100dvh - 28px);color:var(--ink)}
.expense-modal{padding:20px}.expense-heading{display:flex;align-items:center;gap:10px;margin-bottom:18px}
.expense-heading h2{font:400 28px Georgia,serif}.expense-heading .back-page{flex:0 0 33px;margin:0;border-radius:10px}
.expense-dialog .field{color:#596553;font-size:11px;margin:12px 0}.expense-dialog input,.expense-dialog select,.expense-dialog textarea{font:14px Arial,sans-serif;min-width:0;width:100%;border:1px solid var(--line);border-radius:8px;padding:10px;background:var(--paper);color:var(--ink)}
.expense-dialog textarea{resize:vertical}.expense-dialog .notice{font-size:12px;overflow-wrap:anywhere}
.expense-calculation{padding:12px;background:var(--sage);border-radius:8px;color:#596553;font-size:11px}.expense-calculation output{display:block;margin-top:6px;font:400 23px Georgia,serif;color:var(--ink)}
.expense-actions{display:flex;gap:8px;margin-top:18px}.expense-actions button{flex:1;min-height:37px;font-size:11px;border-radius:8px}
.expense-actions .secondary{border:1px solid var(--line);background:var(--paper)}
.expense-error{color:#964737;font-size:12px;line-height:1.4}.expense-error:empty{display:none}.expense-draft-note{color:var(--muted);font-size:10px}
.expense-details{margin:0;display:grid;gap:14px}.expense-details dt{font-size:11px;color:#596553}.expense-details dd{margin:4px 0 0;font-size:14px;white-space:pre-wrap;overflow-wrap:anywhere}
.expense-page button:focus-visible,.expense-dialog button:focus-visible,.expense-page input:focus-visible,.expense-dialog :is(input,select,textarea):focus-visible{outline:2px solid var(--green);outline-offset:3px}
@media(max-width:760px){
 .expense-dialog{width:100%;max-width:none;max-height:100dvh;min-height:100dvh;margin:0;border-radius:0}
 .expense-modal{padding:17px 13px 24px;min-height:100dvh}.expense-dialog .two{grid-template-columns:1fr 1fr}
 .expense-actions{position:sticky;bottom:0;background:var(--paper);padding:12px 0 max(0px,env(safe-area-inset-bottom));z-index:1}
 .expense-row{grid-template-columns:minmax(0,1fr) auto}.expense-row .link{justify-self:start}.expense-row .link:last-child{justify-self:end}
 .expenses-screen .top{gap:8px}.expenses-screen .top .primary{font-size:11px;padding:0 9px}
}
@media(max-width:359px){.expenses-screen h1{font-size:25px}.expenses-screen .top>div{gap:6px}.expenses-screen .top .primary{font-size:10px;padding:0 7px}.expense-dialog .two{grid-template-columns:1fr}}