:root { --msfa-gold:#98730b; --msfa-ink:#20303b; --msfa-muted:#6e7b84; --msfa-border:#e9e3d7; --msfa-cream:#faf8f3; }
* { box-sizing:border-box; }
body { margin:0; background:var(--msfa-cream); color:var(--msfa-ink); font-family:Inter,Arial,sans-serif; }
.msfa-app { display:grid; min-height:100vh; grid-template-columns:264px minmax(0,1fr); }
.msfa-sidebar { min-height:100vh; padding:26px 16px; background:#1d292f; color:#f7f1e6; }
.msfa-brand { display:flex; align-items:center; gap:10px; padding:7px 10px 26px; color:#fffdf8; text-decoration:none; }.msfa-brand>span { display:grid; width:38px; height:38px; place-items:center; border:1px solid rgba(213,174,68,.65); border-radius:11px; color:#f1cf75; font:700 .8rem Georgia,serif; }.msfa-brand strong { font-size:.92rem; }.msfa-brand small { display:block; margin-top:3px; color:#d6c49b; font-size:.68rem; font-weight:600; }
.msfa-nav { display:grid; gap:3px; }.msfa-nav-item { border-left:3px solid transparent; border-radius:0 9px 9px 0; color:#dce2df; font-size:.82rem; font-weight:650; padding:10px; text-decoration:none; }.msfa-nav-item:hover,.msfa-nav-item.is-active { background:rgba(213,174,68,.16); color:#fff4d2; }.msfa-nav-item.is-active { border-left-color:var(--msfa-gold); font-weight:800; }
.msfa-main { min-width:0; }.msfa-topbar { display:flex; align-items:center; justify-content:space-between; gap:18px; min-height:94px; padding:20px clamp(20px,4vw,60px); border-bottom:1px solid var(--msfa-border); background:rgba(255,253,248,.9); }.msfa-topbar h1 { margin:4px 0 0; font-size:clamp(1.35rem,3vw,2rem); letter-spacing:-.035em; }.msfa-content { padding:28px clamp(18px,4vw,60px) 64px; }
.msfa-eyebrow { color:var(--msfa-gold); font-size:.7rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }.msfa-hero,.msfa-page-head { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:22px; }.msfa-hero { padding:clamp(25px,4vw,38px); border:1px solid #ead9ae; border-radius:22px; background:linear-gradient(118deg,#fffdf8 0%,#f8edce 100%); box-shadow:0 10px 28px rgba(68,52,24,.06); }.msfa-hero h2,.msfa-page-head h2,.msfa-card h2 { margin:8px 0; font-size:clamp(1.25rem,3vw,1.85rem); letter-spacing:-.03em; }.msfa-hero p,.msfa-page-head p,.msfa-card p { margin:0; color:var(--msfa-muted); line-height:1.6; }
.msfa-card { background:#fffdf9; border:1px solid var(--msfa-border); border-radius:18px; box-shadow:0 8px 26px rgba(68,52,24,.055); }.msfa-grid { display:grid; gap:18px; margin-bottom:22px; }.msfa-stat-grid { grid-template-columns:repeat(5,minmax(0,1fr)); }.msfa-grid-two { grid-template-columns:1.4fr .8fr; }.msfa-stat-card { display:flex; flex-direction:column; min-height:142px; padding:19px; border-top:3px solid #cba127; }.msfa-stat-card span { color:var(--msfa-muted); font-size:.72rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }.msfa-stat-card strong { margin:10px 0 5px; font-size:1.3rem; letter-spacing:-.03em; overflow-wrap:anywhere; }.msfa-stat-card small { margin-top:auto; color:var(--msfa-muted); font-size:.76rem; }
.msfa-section-head { display:flex; align-items:center; justify-content:space-between; gap:18px; }.msfa-table-card,.msfa-list-card,.msfa-form-card,.msfa-placeholder { padding:24px; }.msfa-table-card .msfa-section-head { margin-bottom:16px; }.msfa-table-scroll { overflow-x:auto; }.msfa-table { width:100%; min-width:600px; border-collapse:collapse; }.msfa-table th { padding:11px 12px; background:#faf5e9; color:#7b705d; font-size:.7rem; letter-spacing:.05em; text-align:left; text-transform:uppercase; }.msfa-table td { padding:12px; border-top:1px solid var(--msfa-border); font-size:.84rem; vertical-align:middle; }.msfa-list-card h2 { font-size:1.15rem; }.msfa-list-row { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:13px 0; border-bottom:1px solid var(--msfa-border); }.msfa-list-row div { display:grid; gap:4px; }.msfa-list-row small { color:var(--msfa-muted); }.msfa-list-row>span { color:var(--msfa-gold); font-size:.76rem; font-weight:750; text-transform:capitalize; }.msfa-empty { margin-top:16px !important; padding:15px; border:1px dashed #d8cfbd; border-radius:10px; text-align:center; }
.msfa-btn { display:inline-flex; align-items:center; justify-content:center; min-height:40px; border:1px solid transparent; border-radius:10px; cursor:pointer; font:700 .82rem Arial,sans-serif; padding:10px 15px; text-decoration:none!important; white-space:nowrap; }.msfa-btn-primary { border-color:var(--msfa-gold); background:var(--msfa-gold); color:#fff!important; }.msfa-btn-primary:hover { background:#785a05; border-color:#785a05; }.msfa-btn-outline { border-color:#d4c5a8; background:#fffdf9; color:var(--msfa-ink)!important; }.msfa-btn-outline:hover { border-color:var(--msfa-gold); background:#faf2de; }
.msfa-input,.msfa-select { width:100%; min-height:42px; border:1px solid #dcd4c5; border-radius:9px; background:#fffdf9; color:var(--msfa-ink); font:inherit; padding:10px 11px; }.msfa-input:focus,.msfa-select:focus { outline:none; border-color:var(--msfa-gold); box-shadow:0 0 0 3px rgba(152,115,11,.12); }.msfa-select { appearance:auto; }.msfa-form { display:grid; gap:20px; margin-top:22px; }.msfa-form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }.msfa-form label { display:grid; gap:7px; font-size:.82rem; font-weight:750; }.msfa-field-wide { grid-column:1/-1; }.msfa-actions { display:flex; flex-wrap:wrap; gap:10px; }.msfa-hidden { display:none!important; }.msfa-alert { margin:0 0 18px; padding:12px 14px; border:1px solid #bfdfc8; border-radius:10px; background:#e8f5eb; color:#17633b; font-size:.86rem; font-weight:650; }.msfa-alert-error { border-color:#f1c6be; background:#fff0ed; color:#9a382d; }
.msfa-badge { display:inline-flex; border-radius:999px; font-size:.72rem; font-weight:750; padding:7px 10px; white-space:nowrap; }.msfa-badge-draft { background:#eef0f2; color:#56616a; }.msfa-badge-confirmed,.msfa-badge-posted { background:#e2f3e8; color:#17633b; }.msfa-badge-cancelled { background:#fde7e5; color:#a83b34; }.msfa-badge-success { background:#e2f3e8; color:#17633b; }.msfa-badge-warning { background:#fff1cf; color:#855c00; }.msfa-badge-danger { background:#fde7e5; color:#a83b34; }
.msfa-login-body { min-height:100vh; background:linear-gradient(135deg,#faf8f3,#f8edce); }.msfa-login-shell { display:grid; min-height:100vh; place-items:center; padding:24px; }.msfa-login-card { width:min(100%,440px); padding:34px; border:1px solid #ead9ae; border-radius:22px; background:#fffdf9; box-shadow:0 16px 42px rgba(68,52,24,.1); }.msfa-login-card h1 { margin:9px 0; font-size:1.75rem; }.msfa-login-card p { color:var(--msfa-muted); line-height:1.6; }.msfa-login-form { display:grid; gap:12px; margin-top:24px; }.msfa-login-form label { display:grid; gap:7px; font-size:.82rem; font-weight:750; }.msfa-login-form .msfa-btn { width:100%; margin-top:7px; }.msfa-back-link { color:var(--msfa-gold); font-size:.8rem; font-weight:750; text-decoration:none; }.msfa-login-card .msfa-back-link { display:inline-block; margin-top:22px; }.msfa-back-link:hover { text-decoration:underline; }
@media (max-width:1180px) { .msfa-stat-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }.msfa-placeholder { max-width:760px; }@media (max-width:900px) { .msfa-app { grid-template-columns:210px minmax(0,1fr); }.msfa-grid-two { grid-template-columns:1fr; } }.msfa-sidebar { padding-inline:11px; }@media (max-width:720px) { .msfa-app { display:block; }.msfa-sidebar { min-height:auto; padding:16px; }.msfa-brand { padding-bottom:14px; }.msfa-nav { display:flex; overflow-x:auto; }.msfa-nav-item { flex:0 0 auto; }.msfa-topbar { min-height:76px; padding:16px; }.msfa-topbar .msfa-back-link { display:none; }.msfa-content { padding:18px 14px 44px; }.msfa-hero,.msfa-page-head { align-items:flex-start; flex-direction:column; }.msfa-stat-grid,.msfa-form-grid { grid-template-columns:1fr; }.msfa-hero .msfa-btn,.msfa-page-head .msfa-btn { width:100%; }.msfa-table-card,.msfa-list-card,.msfa-form-card,.msfa-placeholder { padding:18px 14px; }.msfa-actions { display:grid; }.msfa-actions .msfa-btn { width:100%; } }

/* Stage 1B: transaction-focused semi-app components. */
.msfa-page-header { margin:0 0 22px; }.msfa-page-header h2 { margin:7px 0 8px; font-size:clamp(1.55rem,3vw,2.15rem); letter-spacing:-.035em; }.msfa-page-header p { margin:0; color:var(--msfa-muted); line-height:1.6; }.msfa-page-header-actions { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; }
.msfa-hero-card { display:flex; align-items:center; justify-content:space-between; gap:28px; margin:0 0 22px; padding:clamp(25px,4vw,38px); border-color:#ead9ae; background:linear-gradient(118deg,#fffdf8 0%,#f8edce 100%); }.msfa-hero-card h2 { margin:8px 0; }.msfa-hero-metrics { display:grid; grid-template-columns:repeat(2,minmax(145px,1fr)); gap:14px; min-width:min(100%,440px); }.msfa-hero-metrics>div { display:grid; gap:6px; padding:14px; border:1px solid #eadfca; border-radius:13px; background:rgba(255,253,249,.8); }.msfa-hero-metrics span,.msfa-detail-item span,.msfa-detail-text>span { color:var(--msfa-muted); font-size:.7rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }.msfa-hero-metrics strong { color:var(--msfa-ink); font-size:1.12rem; letter-spacing:-.02em; }.msfa-hero-metrics .msfa-form-actions { grid-column:1/-1; padding:0; border:0; background:transparent; }
.msfa-stat-grid { grid-template-columns:repeat(5,minmax(0,1fr)); }.msfa-dashboard-lists { grid-template-columns:minmax(0,1.45fr) minmax(230px,.8fr) minmax(230px,.8fr); align-items:start; }.msfa-empty-state { margin:16px 0 0; padding:16px; border:1px dashed #d8cfbd; border-radius:11px; background:#fcfaf5; color:var(--msfa-muted); text-align:center; }.msfa-quick-actions { margin-top:22px; padding:24px; }.msfa-quick-actions h2 { margin-top:7px; font-size:1.2rem; }.msfa-quick-action-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:18px; }.msfa-quick-action { display:grid; gap:5px; min-height:96px; padding:15px; border:1px solid #eadfca; border-radius:13px; background:#fcfaf5; color:var(--msfa-ink); text-decoration:none; transition:border-color .18s ease,background .18s ease,transform .18s ease; }.msfa-quick-action:hover { border-color:var(--msfa-gold); background:#fff8e8; color:var(--msfa-ink); transform:translateY(-1px); }.msfa-quick-action small { color:var(--msfa-muted); font-size:.76rem; line-height:1.45; }
.msfa-filter-card { margin-bottom:22px; padding:22px; }.msfa-filter-card h2 { margin:6px 0 0; font-size:1.15rem; }.msfa-filter-card .msfa-form { margin-top:18px; }.msfa-filter-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }.msfa-form-actions,.msfa-action-bar { display:flex; flex-wrap:wrap; gap:10px; align-items:center; }.msfa-filter-card .msfa-form-actions { padding-top:2px; }.msfa-btn-danger { border-color:#d8a59e; background:#fffafa; color:#9b3b32!important; }.msfa-btn-danger:hover { border-color:#b7574e; background:#fff0ed; color:#8d322a!important; }.msfa-btn-sm { min-height:33px; border-radius:8px; font-size:.73rem; padding:8px 10px; }.msfa-action-bar-inline { gap:7px; }.msfa-action-bar form { margin:0; }.msfa-transaction-table { min-width:1120px; }
.msfa-alert-success { border-color:#bfdfc8; background:#e8f5eb; color:#17633b; }.msfa-alert-warning { border-color:#ead5a2; background:#fff6df; color:#7b5b0a; }.msfa-detail-hero { align-items:center; }.msfa-detail-hero>div:first-child { display:grid; gap:7px; }.msfa-detail-hero>div:first-child>strong { font-size:clamp(2rem,5vw,3.1rem); letter-spacing:-.05em; }.msfa-detail-hero p { font-weight:650; }.msfa-detail-hero-summary { display:grid; justify-items:end; gap:9px; text-align:right; }.msfa-detail-hero-summary>strong { font-size:1.05rem; }.msfa-detail-hero-summary small { color:var(--msfa-muted); }.msfa-detail-card,.msfa-action-card { margin-top:22px; padding:24px; }.msfa-detail-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }.msfa-detail-item { display:grid; gap:6px; min-height:82px; padding:14px; border:1px solid #eee4d1; border-radius:12px; background:#fcfaf5; }.msfa-detail-item strong { overflow-wrap:anywhere; }.msfa-detail-text { display:grid; gap:7px; margin-top:18px; padding-top:18px; border-top:1px solid var(--msfa-border); }.msfa-detail-text p { white-space:pre-line; }.msfa-action-card { display:grid; gap:12px; }.msfa-action-info { margin:0; padding:10px 12px; border-left:3px solid var(--msfa-gold); border-radius:4px; background:#f8f0de; color:#67552c; font-size:.84rem; }
@media (max-width:1180px) { .msfa-stat-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }.msfa-dashboard-lists { grid-template-columns:repeat(2,minmax(0,1fr)); }.msfa-dashboard-lists .msfa-list-card:last-child { grid-column:1/-1; }.msfa-quick-action-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.msfa-filter-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:760px) { .msfa-page-header-actions,.msfa-hero-card,.msfa-detail-hero { align-items:flex-start; flex-direction:column; }.msfa-page-header-actions>.msfa-btn { width:100%; }.msfa-hero-metrics { width:100%; grid-template-columns:1fr; }.msfa-stat-grid,.msfa-dashboard-lists,.msfa-quick-action-grid,.msfa-filter-grid,.msfa-detail-grid { grid-template-columns:1fr; }.msfa-dashboard-lists .msfa-list-card:last-child { grid-column:auto; }.msfa-form-actions,.msfa-action-bar { align-items:stretch; flex-direction:column; width:100%; }.msfa-form-actions .msfa-btn,.msfa-action-bar .msfa-btn,.msfa-action-bar form,.msfa-action-bar form .msfa-btn { width:100%; }.msfa-detail-hero-summary { justify-items:start; text-align:left; }.msfa-detail-card,.msfa-action-card,.msfa-filter-card,.msfa-quick-actions { padding:18px 14px; } }

/* Stage 1C: Cash & Bank and Program Accounting. */
.msfa-summary-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:18px; margin:0 0 22px; }
.msfa-summary-card { display:flex; min-height:128px; flex-direction:column; justify-content:center; padding:19px; border-top:3px solid #cba127; }
.msfa-summary-card span { color:var(--msfa-muted); font-size:.7rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.msfa-summary-card strong { margin:9px 0 5px; color:var(--msfa-ink); font-size:1.23rem; letter-spacing:-.03em; overflow-wrap:anywhere; }
.msfa-summary-card small { color:var(--msfa-muted); font-size:.76rem; }
.msfa-balance-card,.msfa-program-metric { border-color:#e5d3a4; background:linear-gradient(135deg,#fffdf8,#fbf2dd); }
.msfa-detail-header { margin-bottom:22px; }.msfa-detail-header h2 { font-size:clamp(1.55rem,4vw,2.25rem); }
.msfa-action-row { display:flex; flex-wrap:wrap; gap:10px; justify-content:flex-end; }
.msfa-link-card { color:var(--msfa-ink); text-decoration:none; }.msfa-inline-link { color:var(--msfa-gold); font-weight:750; text-decoration:none; }.msfa-inline-link:hover { text-decoration:underline; }
.msfa-cash-bank-table { min-width:1120px; }.msfa-program-table { min-width:1350px; }
.msfa-checkbox { grid-template-columns:auto 1fr; align-items:center; gap:9px!important; padding:10px 0; }.msfa-checkbox input { width:17px; height:17px; accent-color:var(--msfa-gold); }
.msfa-badge-planning { background:#fff1cf; color:#855c00; }.msfa-badge-running { background:#e3effa; color:#245987; }.msfa-badge-closed { background:#e2f3e8; color:#17633b; }
@media (max-width:1180px) { .msfa-summary-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:760px) { .msfa-summary-grid { grid-template-columns:1fr; }.msfa-action-row { width:100%; }.msfa-action-row .msfa-btn { width:100%; } }

/* Stage 1D: vendor obligations and settlement payments. */
.msfa-vendor-summary .msfa-summary-card { min-height:134px; }.msfa-settlement-card { border-color:#e7cf98; background:linear-gradient(135deg,#fffdf8,#fbf1d8); }
.msfa-payment-list { margin-top:22px; }.msfa-vendor-table { min-width:1180px; }
.msfa-due-badge { display:inline-flex; padding:6px 9px; border-radius:999px; background:#f8f0de; color:#705b26; font-size:.74rem; font-weight:750; white-space:nowrap; }
.msfa-money-positive { color:#17633b!important; }.msfa-money-negative { color:#9b3b32!important; }.msfa-money-warning { color:#855c00!important; }
.msfa-badge-partial { background:#fff1cf; color:#855c00; }.msfa-badge-paid { background:#e2f3e8; color:#17633b; }
@media (max-width:760px) { .msfa-vendor-summary { grid-template-columns:1fr; } }