#madeExpensesDialog{width:min(900px,96vw);max-height:94dvh;padding:0;border:1px solid #c9d5e5;border-radius:12px;color:#173650}#madeExpensesDialog::backdrop{background:#102b4866}#madeExpensesDialog header{position:sticky;top:0;z-index:2;display:flex;align-items:center;gap:16px;padding:12px;background:white;border-bottom:1px solid #ccd7e6}#madeExpensesDialog h2{font-size:22px;margin:0}.expenseBody{padding:16px}.expenseInputRow{display:grid;grid-template-columns:150px 1fr 130px auto;gap:8px;margin-bottom:12px;align-items:end}.expenseInputRow label{display:grid;gap:4px}.expenseInputRow input{min-width:0;width:100%;box-sizing:border-box;padding:10px;border:1px solid #b8c8dc;border-radius:6px;font:inherit}.expenseTotal{display:block;margin:14px 0}.expenseHistoryRow{display:flex;flex-wrap:wrap;gap:10px;padding:12px 0;border-bottom:1px solid #ccd7e6}.expenseHistoryRow>span:first-of-type{flex:1;min-width:150px}.expensePending{border-left:3px solid #c51d35;padding-left:10px}.unpaidExpense,.hasUnpaidExpenses{border:2px solid #c51d35!important;color:#b91530!important}.expenseUnpaidBadge{display:block;background:#c51d35;color:white;padding:3px 6px;border-radius:6px;font-size:11px}.expenseUnpaidBadge[hidden]{display:none}.madeExpenseOpen{margin-bottom:12px}.expenseAttention{width:100%;margin-bottom:12px}@media(max-width:600px){.expenseInputRow{grid-template-columns:1fr 1fr}.expenseInputRow label:nth-child(2){grid-column:1/-1;grid-row:2}.expenseBody{padding:12px}#madeExpensesDialog{width:100%;max-width:100%;height:100dvh;max-height:100dvh;border-radius:0;margin:0}.expenseHistoryRow{flex-direction:column}#madeExpensesDialog button{min-height:44px}}
.expensePeriodControls label,.expenseEditDialog label{display:grid;gap:6px}.expensePeriodControls select,.expenseEditDialog input{font:inherit;padding:10px;border:1px solid #b8c8dc;border-radius:6px;max-width:100%;box-sizing:border-box}.expenseEditDialog{width:min(540px,calc(100vw - 24px));max-height:90dvh;box-sizing:border-box;border:1px solid #b8c8dc;border-radius:12px;color:#173650}.expenseEditDialog label{margin:12px 0}.expenseEditDialog button{margin:4px;min-height:44px}.expenseChangeHistory{flex-basis:100%;overflow-wrap:anywhere}.expenseTotalsWrap{overflow:auto}.expenseTotals{width:100%;border-collapse:collapse}.expenseTotals th,.expenseTotals td{padding:12px;text-align:right;border-bottom:1px solid #ccd7e6;white-space:nowrap}.expenseTotals th:first-child{text-align:left;white-space:normal}.expenseTotals tfoot{font-weight:700;background:#eef4fb}@media(max-width:600px){.expenseTotals th,.expenseTotals td{font-size:12px;padding:7px 4px}.expensePeriodControls select{width:100%}}

.expenseDescription{flex-basis:100%;min-width:0;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.5}

#driver .madeExpenseOpen{display:block!important;width:100%!important;min-height:76px!important;background:#1262cc!important;color:#fff!important;border:2px solid #0c4daa!important;border-radius:12px!important;font-size:23px!important;font-weight:750!important;margin:0 0 18px!important;padding:18px!important}.expenseFileBox{grid-column:1/-1;display:grid;gap:8px;padding:12px;background:#edf4ff;border-radius:9px;overflow-wrap:anywhere}.expenseFileBox button{min-height:46px}.expenseFileBox small{line-height:1.4}.expenseAttachmentPreview{width:min(900px,96vw);max-height:95dvh;box-sizing:border-box}.expenseAttachmentPreview img{display:block;max-width:100%;height:auto}.expenseAttachmentPreview iframe{width:100%;height:75dvh;border:0}.expenseAttachmentPreview>a{display:block;padding:12px}
#driver .expensePaymentActions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:16px}#driver .expensePaymentActions .madeExpenseOpen,#driver .expensePaymentActions .expenseFundOpen{display:block!important;width:100%!important;min-height:76px!important;margin:0!important;padding:12px!important;font-size:18px!important;white-space:normal;background:#1262cc!important;color:white!important;border:2px solid #0c4daa!important;border-radius:12px!important}#expenseFundsDialog{width:min(900px,96vw);max-height:94dvh;padding:0;border:1px solid #c9d5e5;border-radius:12px;color:#173650}#expenseFundsDialog header{position:sticky;top:0;z-index:2;display:flex;align-items:center;gap:12px;padding:12px;background:white;border-bottom:1px solid #ccd7e6}#expenseFundsDialog header button{background:#1262cc;color:white}#expenseFundsDialog h2{font-size:22px;margin:0}#expenseFundsDialog button{min-height:46px;margin:4px}.expenseFundForm{display:grid;gap:12px;margin:16px 0}.expenseFundForm label{display:grid;gap:6px}.expenseFundForm input,.expenseFundForm textarea{font:inherit;padding:12px;border:1px solid #b8c8dc;border-radius:8px;box-sizing:border-box;width:100%}.expenseFundSummary{padding:14px;background:#eef4fb;border-radius:10px;margin:12px 0;overflow-wrap:anywhere}.expenseFundsOffice{width:100%;margin-bottom:12px}@media(max-width:600px){#expenseFundsDialog{width:100%;max-width:100%;height:100dvh;max-height:100dvh;border-radius:0;margin:0;box-sizing:border-box}#expenseFundsDialog h2{font-size:19px}}
/* Compact office attention page: natural rows instead of fixed grid coordinates. */
#admin#admin #officeNotes.active{display:flex!important;flex-wrap:wrap;align-content:flex-start;align-items:flex-start;gap:12px!important}
#admin #officeNotes>h2{order:-10;flex:0 0 100%;margin:0!important;font-size:22px}
#admin #officeNotes>.payAttention,#admin #officeNotes>.expenseFundsOffice{order:-9;flex:1 1 300px;width:auto;margin:0!important;padding:12px!important;min-height:48px!important}
#admin #officeNotes>.expenseAttention{display:none!important}
#admin #officeNotes>.inlineExpenses{order:-8;flex:1 1 65%;min-width:0;margin:0!important;padding:14px!important;box-sizing:border-box}
#admin #officeNotes>.dashAreaAttention{order:-7;flex:1 1 260px;min-width:0;max-width:none!important;width:auto!important;margin:0!important;padding:14px!important;box-sizing:border-box}
#admin #officeNotes>#agendaNotesCard,#admin #officeNotes>.officeNoteCards,#admin #officeNotes>#dashNotesOverview{flex:1 1 100%;margin:0!important;min-width:0}
#admin #officeNotes .card{min-height:0!important}#admin #officeNotes .officeNoteCards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:10px}#admin #officeNotes .officeNoteCards>.card{padding:14px!important;margin:0!important}
.inlineExpenseHead{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px}.inlineExpenseHead h3{margin:0}.inlineExpenses select{padding:8px;margin:10px 0;border:1px solid #cbd9e9;border-radius:8px;font:inherit}.inlineExpenseItems{max-height:55dvh;overflow:auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));gap:8px}.inlineExpenseItems article{padding:10px;border:1px solid #d8e2ef;border-radius:8px;display:grid;gap:6px;overflow-wrap:anywhere}.inlineExpenseItems article p{margin:0}.inlineExpenseItems article button{justify-self:start}.inlineExpenses>p{margin:6px 0 10px}
#madeExpensesDialog{width:calc(100vw - 24px);max-width:1400px;max-height:calc(100dvh - 24px)}
@media(max-width:760px){#admin #officeNotes>.inlineExpenses,#admin #officeNotes>.dashAreaAttention{flex-basis:100%}.inlineExpenseItems{max-height:65dvh}}


.expenseDirectActions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.expenseDirectActions .btn{min-height:44px}.expenseSearchBar{display:flex;align-items:end;flex-wrap:wrap;gap:8px;margin:14px 0}.expenseSearchBar[hidden]{display:none}.expenseSearchBar label{display:grid;gap:6px;flex:1;max-width:600px}.expenseSearchBar input{box-sizing:border-box;width:100%;font:inherit;padding:12px;border:1px solid #b8c8dc;border-radius:8px}.expenseSearchBar input:focus-visible{outline:2px solid #1262cc;outline-offset:2px}
.inlineExpenseItems article>.expenseDirectActions{display:flex!important;flex-wrap:nowrap!important;align-items:center;gap:8px;min-width:0;max-width:100%;overflow-x:auto;padding:2px 0}.inlineExpenseItems .expenseDirectActions>.btn{flex:0 0 auto;margin:0!important;min-height:44px;white-space:nowrap}

/* Office actions above a full-width expense overview. */
#admin#admin #officeNotes>.payAttention,#admin#admin #officeNotes>.expenseFundsOffice{order:-9;flex:1 1 0!important;min-width:0!important;max-width:none!important;width:auto!important;min-height:48px!important;align-self:stretch;box-sizing:border-box}
#admin#admin #officeNotes>.inlineExpenses{order:-8;flex:0 0 100%!important;width:100%!important;max-width:100%!important;min-width:0!important}
#admin#admin #officeNotes>.dashAreaAttention{order:-7;flex:1 1 100%!important;width:100%!important}
#admin #officeNotes .inlineExpenseItems{max-height:none!important;overflow:visible!important;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));align-items:start}

/* Notes first, fluid full-width workspace. */
#admin#admin #officeNotes.active{width:100%!important;max-width:none!important;min-width:0;box-sizing:border-box;align-content:flex-start!important}
#admin#admin #officeNotes>.officeNoteCards{order:-10;flex:0 0 100%!important;width:100%!important;max-width:100%!important;min-width:0;box-sizing:border-box;align-items:start}
#admin#admin #officeNotes>h2{order:-11}
#admin#admin #officeNotes .officeNoteCard{min-width:0;max-width:100%;height:auto!important;box-sizing:border-box;overflow-wrap:anywhere}
#admin#admin #officeNotes .officeNoteCard .actions{display:flex!important;flex-flow:row nowrap!important;gap:8px;overflow-x:auto;align-items:center}
#admin#admin #officeNotes .officeNoteCard .actions>.btn{flex:0 0 auto;margin:0!important;min-height:36px;white-space:nowrap}
#admin#admin #officeNotes>#agendaNotesCard{width:100%!important;max-width:none!important;box-sizing:border-box}

/* New note immediately above made expenses. */
#admin#admin #officeNotes>#agendaNotesCard{order:-8;flex:0 0 100%!important;margin:0!important}
#admin#admin #officeNotes>.inlineExpenses{order:-7}
#admin#admin #officeNotes>.dashAreaAttention{order:-6}

/* Compact horizontal notes and entry fields. */
#admin#admin #officeNotes .officeNoteCards{grid-template-columns:repeat(auto-fit,minmax(min(100%,740px),1fr))!important;gap:8px!important}
#admin#admin #officeNotes .officeNoteCard{display:grid!important;grid-template-columns:minmax(160px,1fr) minmax(180px,2fr) auto;gap:6px 14px!important;align-items:center!important;padding:12px!important}
#admin#admin #officeNotes .officeNoteCard>h3{margin:0!important;font-size:15px!important;grid-column:1}
#admin#admin #officeNotes .officeNoteCard>p.muted{grid-column:1;font-size:12px!important;margin:0!important}
#admin#admin #officeNotes .officeNoteCard>p:not(.muted){grid-column:2;grid-row:1/3;margin:0!important;font-size:13px!important;line-height:1.4}
#admin#admin #officeNotes .officeNoteCard>.actions{grid-column:3;grid-row:1/3;gap:5px!important}
#admin#admin #officeNotes .officeNoteCard>.actions>.btn{padding:7px!important;font-size:12px!important;min-height:34px!important}
#admin#admin #officeNotes .officeNoteCard>form{grid-column:1/-1;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px}
#admin#admin #officeNotes #agendaNotesCard{padding:12px!important}
#admin#admin #officeNotes #agendaNoteForm:not(.hidden){display:grid!important;grid-template-columns:140px 160px minmax(150px,1fr) minmax(200px,2fr) auto;align-items:end;gap:10px!important;margin-top:10px!important}
#admin#admin #officeNotes #agendaNoteForm>.agendaNoteGrid{display:contents!important}
#admin#admin #officeNotes #agendaNoteForm :is(.field,label){min-width:0!important;grid-column:auto!important;margin:0!important;display:flex;flex-direction:column;gap:4px;font-size:12px}
#admin#admin #officeNotes #agendaNoteForm :is(input,select,textarea){width:100%!important;min-width:0!important;box-sizing:border-box;height:40px!important;min-height:40px!important;padding:8px!important;font-size:13px!important}
#admin#admin #officeNotes #agendaNoteForm>.actions{display:flex!important;flex-wrap:nowrap!important;gap:6px!important;margin:0!important}
#admin#admin #officeNotes #agendaNoteForm>.actions .btn{min-height:40px!important;margin:0!important;padding:8px!important;font-size:12px!important}
@media(max-width:1100px){#admin#admin #officeNotes .officeNoteCard{grid-template-columns:1fr!important}#admin#admin #officeNotes .officeNoteCard>:is(h3,p,.actions){grid-column:1!important;grid-row:auto!important}#admin#admin #officeNotes #agendaNoteForm:not(.hidden){grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:500px){#admin#admin #officeNotes #agendaNoteForm:not(.hidden){grid-template-columns:1fr!important}}

/* Manual office expense payments: compact fields, no horizontal scrolling. */
#expenseFundsDialog .expenseRegistration{border:1px solid #ccdbed;border-radius:12px;padding:14px;margin:12px 0;background:#f4f8ff}
#expenseFundsDialog .expenseRegistration>summary{cursor:pointer;font-weight:750;color:#125fc4;padding:8px 0}
#expenseFundsDialog .expenseRegistrationForm{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:12px;align-items:end}
#expenseFundsDialog .expenseRegistrationForm label{display:grid;gap:6px;min-width:0}
#expenseFundsDialog .expenseRegistrationForm :is(input,select){width:100%;min-width:0;min-height:44px;box-sizing:border-box;padding:8px;font:inherit;border:1px solid #cbd9e9;border-radius:8px}
#expenseFundsDialog .expenseRegistrationActions{display:flex;gap:8px;align-items:stretch}
#expenseFundsDialog .expenseRegistrationActions button{width:100%;min-height:44px;white-space:normal}
#expenseFundsDialog .expenseRegistrationMessage{grid-column:1/-1;margin:0;color:#a01928}
#expenseFundsDialog .expenseRegistrationForm .expenseRegistrationConfirmation{display:flex;align-items:center;gap:8px}
#expenseFundsDialog .expenseRegistrationForm input[type=checkbox]{width:20px;min-height:20px;height:20px;flex:0 0 20px}

.expenseReceiptSequence[open]{width:calc(100vw - 24px)!important;max-width:none!important;height:calc(100dvh - 24px)!important;max-height:none!important;padding:12px!important;display:flex;flex-direction:column;gap:10px;box-sizing:border-box}.expenseReceiptToolbar{display:flex;align-items:center;flex-wrap:wrap;gap:8px;flex:0 0 auto}.expenseReceiptToolbar .btn{min-height:44px}.expenseReceiptToolbar strong{flex:1;min-width:100px;overflow-wrap:anywhere}.expenseReceiptBody{flex:1;min-height:0;overflow:auto;display:flex;justify-content:center;align-items:center}.expenseReceiptBody img{width:100%;height:100%;object-fit:contain}.expenseReceiptBody iframe{width:100%;height:100%;border:0}

/* Lock only the background while the receipt viewer is open. */
html:has(.expenseReceiptSequence[open]),body:has(.expenseReceiptSequence[open]){overflow:hidden!important;scrollbar-gutter:auto!important}
body:has(.expenseReceiptSequence[open]) dialog[open]:not(.expenseReceiptSequence){overflow:hidden!important}


/* Expense cards fit their actions instead of clipping a horizontal toolbar. */
#admin .inlineExpenseItems{grid-template-columns:repeat(auto-fit,minmax(min(100%,390px),1fr))!important;gap:8px!important;align-items:start}
#admin .inlineExpenseItems article{min-width:0!important;padding:9px!important;gap:4px!important;align-content:start;font-size:13px;line-height:1.3}
#admin .inlineExpenseItems article p{line-height:1.3!important;margin:0!important}
#admin .inlineExpenseItems article>.expenseDirectActions{display:flex!important;flex-wrap:nowrap!important;gap:5px!important;align-items:stretch!important;overflow:visible!important;padding:2px 0!important;width:100%;box-sizing:border-box}
#admin .inlineExpenseItems article>.expenseDirectActions>.btn{flex:1 1 0!important;min-width:0!important;width:auto!important;max-width:100%!important;min-height:38px!important;height:auto!important;margin:0!important;padding:6px 5px!important;font-size:12px!important;line-height:1.2!important;white-space:normal!important;overflow-wrap:anywhere!important}

.inlineExpenseToolbar{display:flex;align-items:end;gap:10px;flex-wrap:wrap}.inlineExpenseToolbar label{display:grid;gap:4px;flex:1 1 200px;min-width:0}.inlineExpenseToolbar select{width:100%;margin:0;box-sizing:border-box;min-height:44px}.inlineExpenseToolbar>.btn{flex:1 1 180px;min-height:44px}

/* Put attention and open checks before the expense history. */
#admin#admin #officeNotes>.dashAreaAttention{order:-30!important;flex:1 1 100%!important;width:100%!important}
#admin#admin #officeNotes>#officeInboxSummary{order:-29!important;flex:1 1 240px!important;min-width:0;margin:0!important;align-self:center}
#admin#admin #officeNotes>.payNoticeLink,#admin#admin #officeNotes>.fundsNoticeLink{order:-29!important;flex:1 1 280px!important;min-width:0;width:auto!important;margin:0!important;min-height:44px;white-space:normal;box-sizing:border-box}
#admin#admin #officeNotes>.inlineExpenses{order:-8!important;flex-basis:100%!important;width:100%!important}

#openExpenseWorkspace{margin:0 0 10px;min-height:44px}
#expenseWorkspace[open]{display:flex!important;flex-direction:column;position:fixed;inset:12px;width:auto!important;max-width:none!important;height:calc(100dvh - 24px)!important;max-height:none!important;margin:0!important;padding:12px;box-sizing:border-box;border:1px solid #cbd9e9;border-radius:12px;color:#173650;background:white}
#expenseWorkspace>header{display:flex;align-items:center;gap:12px;flex:0 0 auto;margin-bottom:10px}
#expenseWorkspace .expenseWorkspaceContent{flex:1;min-height:0;overflow:hidden}
#expenseWorkspace .inlineExpenses{height:100%;display:flex;flex-direction:column;box-sizing:border-box;margin:0;padding:10px;min-height:0}
#expenseWorkspace .inlineExpenseItems{flex:1;min-height:0;max-height:none;overflow:auto}
#expenseWorkspace .inlineExpenseHead{display:none}
html:has(#expenseWorkspace[open]),body:has(#expenseWorkspace[open]){overflow:hidden!important}

/* Attention uses the available width instead of five full-width rows. */
body #admin#admin #officeNotes>.dashAreaAttention{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:8px!important;padding:12px!important;min-height:0!important;height:auto!important}
body #admin#admin #officeNotes>.dashAreaAttention>h3{grid-column:1/-1;margin:0!important;font-size:18px!important}
body #admin#admin #officeNotes .dashAttentionItem{width:100%!important;min-width:0!important;height:auto!important;min-height:64px!important;margin:0!important;padding:9px!important;box-sizing:border-box;font-size:14px!important;line-height:1.25!important}
body #admin#admin #officeNotes .dashAttentionItem small{font-size:12px!important;line-height:1.25!important;margin-top:4px!important}
body #admin#admin #officeNotes.active{gap:8px!important;min-height:0!important;align-content:start!important}
body #admin#admin #officeNotes .officeNoteCard{padding:10px!important;gap:4px 12px!important;min-height:0!important;height:auto!important}
body #admin#admin #officeNotes .officeNoteCard>.officeInboxActions{margin:0!important;padding:2px 0!important}
body #admin#admin #officeNotes>.payNoticeLink,body #admin#admin #officeNotes>.fundsNoticeLink{padding:8px!important;font-size:14px!important;min-height:40px!important}
body #admin#admin #officeNotes>#officeInboxSummary{font-size:14px!important;line-height:1.3!important}
@media(max-width:900px){body #admin#admin #officeNotes>.dashAreaAttention{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:450px){body #admin#admin #officeNotes>.dashAreaAttention{grid-template-columns:minmax(0,1fr)!important}}

.expenseBalanceFacts{display:grid;grid-template-columns:repeat(auto-fit,minmax(155px,1fr));gap:8px;margin:8px 0}.expenseBalanceFacts>div{display:flex;flex-direction:column;gap:3px;min-width:0}.expenseFundSummary>small{display:block;line-height:1.4}
@layer office-single-workspace {
 body #madeExpensesDialog .expenseHistoryRow button,body .expenseDirectActions button{background:#1464e8!important;color:#fff!important;border-color:#1464e8!important;}
 body #madeExpensesDialog .expenseHistoryRow button:hover,body .expenseDirectActions button:hover{background:#1055c7!important;border-color:#1055c7!important;}
}
#madeExpensesDialog .expenseBalanceDetails{margin:16px 0;border:1px solid #cbd9eb;border-radius:10px;padding:12px}#madeExpensesDialog .expenseBalanceDetails>summary{font-weight:700;cursor:pointer;padding:8px;color:#153650}#madeExpensesDialog .expensePending{border-left:4px solid #1464e8}
#madeExpensesDialog .expenseNotificationTarget{outline:3px solid #1764df;outline-offset:3px;scroll-margin-top:12px}

body #madeExpensesDialog.officeExpensesCompact .expenseBody{padding:12px 16px!important;overflow:auto;min-height:0}
body #madeExpensesDialog.officeExpensesCompact .expenseBody>p:empty{display:none}
body #madeExpensesDialog.officeExpensesCompact .expenseSearchBar{display:flex;gap:10px;align-items:end;margin:0 0 10px}
body #madeExpensesDialog.officeExpensesCompact .expenseSearchBar[hidden]{display:none}
body #madeExpensesDialog.officeExpensesCompact .expenseSearchBar>label{flex:1;max-width:none;min-width:180px}
body #madeExpensesDialog.officeExpensesCompact .expensePeriodControls{flex:1;min-width:220px;margin:0;order:1}
body #madeExpensesDialog.officeExpensesCompact .expensePeriodControls label{display:grid;gap:6px}
body #madeExpensesDialog.officeExpensesCompact .expenseRefresh{order:2;background:#1464e8!important;color:white!important}
body #madeExpensesDialog.officeExpensesCompact input,body #madeExpensesDialog.officeExpensesCompact select{height:44px!important;min-height:44px!important;padding:8px 12px!important;font-size:15px!important;box-sizing:border-box;width:100%}
body #madeExpensesDialog.officeExpensesCompact .expensePeriodHelp{font-size:13px;margin:6px 0;color:#536b82}
body #madeExpensesDialog.officeExpensesCompact .expensePeriodHelp summary{cursor:pointer}
body #madeExpensesDialog.officeExpensesCompact .expenseBody p{margin:8px 0;font-size:14px}
body #madeExpensesDialog.officeExpensesCompact .expenseBody h3{font-size:18px;margin:14px 0 8px}
body #madeExpensesDialog.officeExpensesCompact .expenseHistoryRow{display:block!important;width:100%;box-sizing:border-box;padding:12px!important;margin:0 0 10px!important;border:1px solid #ccdbee;border-left:4px solid #1464e8;border-radius:10px;background:#f8fbff}
body #madeExpensesDialog.officeExpensesCompact .expenseCardHeading{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;font-size:15px}
body #madeExpensesDialog.officeExpensesCompact .expenseCardHeading>b{font-size:19px;margin-left:auto}
body #madeExpensesDialog.officeExpensesCompact .expenseCardHeading>span:last-child{font-size:13px;background:#e8effa;padding:4px 8px;border-radius:6px}
body #madeExpensesDialog.officeExpensesCompact .expenseCardInfo{display:flex;flex-wrap:wrap;gap:4px 18px;margin:8px 0;font-size:13px;overflow-wrap:anywhere}
body #madeExpensesDialog.officeExpensesCompact .expenseCardInfo p{margin:0;font-size:13px}
body #madeExpensesDialog.officeExpensesCompact .expenseCardInfo>small{flex-basis:100%;font-size:12px;color:#536b82}
body #madeExpensesDialog.officeExpensesCompact .expenseDescription{flex-basis:100%;margin:4px 0!important;font-size:13px}
body #madeExpensesDialog.officeExpensesCompact .expenseCardActions{display:flex;flex-wrap:wrap;gap:8px;border-top:1px solid #dce5f1;padding-top:9px}
body #madeExpensesDialog.officeExpensesCompact .expenseCardActions .expenseDirectActions{display:contents}
body #madeExpensesDialog.officeExpensesCompact button.btn{height:auto!important;min-height:40px!important;padding:8px 14px!important;font-size:14px!important;line-height:1.3!important;width:auto!important;flex:0 1 auto}
@media(max-width:600px){body #madeExpensesDialog.officeExpensesCompact .expenseSearchBar>label,body #madeExpensesDialog.officeExpensesCompact .expensePeriodControls{flex-basis:100%;min-width:0}body #madeExpensesDialog.officeExpensesCompact .expenseCardActions button.btn{flex:1 1 140px}body #madeExpensesDialog.officeExpensesCompact .expenseCardHeading>span:last-child{flex-basis:100%}}

/* A notification starts below the header, including the final short item. */
body #madeExpensesDialog.expenseNotificationView[open]{display:flex!important;flex-direction:column!important;height:96dvh!important;max-height:96dvh!important;overflow:hidden!important;box-sizing:border-box!important}
body #madeExpensesDialog.expenseNotificationView>header{position:relative!important;top:auto!important;flex:0 0 auto!important}
body #madeExpensesDialog.expenseNotificationView>.expenseBody{flex:1 1 0!important;min-height:0!important;overflow:auto!important;scroll-behavior:auto!important;overflow-anchor:none!important}
.expenseNotificationSpace{flex:none;pointer-events:none}