:root {
  --navy: #1a2744;
  --mid: #2d3f6e;
  --lite: #e8edf5;
  --alt: #f5f7fa;
  --red: #ffffff;
  --red-monthly: #ffffff;
  --plat-hdr: #3d4551;
  --border: #c5cde0;
  --white: #fff;
  --sub-bg: #dce4f4;
  --today: #fffbe6;
  --demo: #0d6efd;
  --ok: #2a6e3f;
  --err-bg: #fde8e8;
  --today-toolbar-offset: 2.35rem;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

body {
  background: #f0f2f7;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  font-size: 13px;
  color: #111;
}

.demo-banner {
  background: linear-gradient(90deg, #0d6efd, #6610f2);
  color: #fff;
  text-align: center;
  padding: 0.45rem 1rem;
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.04em;
}

.page { max-width: none; width: 100%; margin: 0 auto; padding: 1.25rem 1rem 3rem; }

.ph {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
  flex-wrap: wrap;
}

.ph h1 {
  font-size: 1.35rem;
  color: var(--navy);
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.badge {
  display: inline-block;
  border-radius: 4px;
  font-size: 0.68rem;
  padding: 0.2rem 0.45rem;
  font-weight: 600;
}

.badge-demo { background: #cfe2ff; color: #084298; }
.badge-live { background: #d4edda; color: #155724; }

.meta-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 1rem;
  font-size: 0.78rem;
  color: #555;
}

.meta-item { color: #666; }
.refresh-hint { color: var(--demo); font-weight: 600; }

.audit-tbl { font-size: 0.72rem; }
.audit-tbl .formula-cell { text-align: left; font-size: 0.68rem; color: #444; max-width: 140px; white-space: normal; }
.audit-tbl .src-cell { text-align: left; font-family: ui-monospace, monospace; font-size: 0.68rem; color: #555; }
.audit-tbl .audit-today { color: var(--navy); font-weight: 700; }
.audit-plat td { background: var(--sub-bg); font-weight: 700; color: var(--navy); text-align: left !important; }
.audit-diff-warn { color: #c0392b !important; font-weight: 700; }

.sub { font-size: 0.78rem; color: #666; margin-top: 0.2rem; }

.live-status {
  font-size: 0.78rem;
  color: #444;
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 0.5rem 0.75rem;
  white-space: nowrap;
}

.ls-date { font-weight: 600; color: var(--navy); }
.ls-sep { margin: 0 0.35rem; color: #aaa; }
.ls-lbl { color: #888; }
.ls-val { font-weight: 600; }
.ls-countdown { color: var(--demo); font-weight: 600; }

.alert {
  border-radius: 8px;
  padding: 1rem 1.25rem;
  margin-bottom: 1rem;
}

.alert-error {
  background: var(--err-bg);
  border: 1px solid #f5c2c7;
  color: #842029;
}

.alert-hint { margin-top: 0.5rem; font-size: 0.85rem; color: #666; }
code { background: rgba(0,0,0,0.06); padding: 0.1rem 0.35rem; border-radius: 3px; font-size: 0.9em; }

.tabs {
  display: flex;
  border-bottom: 2px solid var(--border);
  margin-bottom: 1.25rem;
  flex-wrap: wrap;
}

.tab-btn {
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  padding: 0.55rem 1rem;
  font-size: 0.85rem;
  font-weight: 600;
  color: #666;
  cursor: pointer;
}

.tab-btn:hover { color: var(--mid); }
.tab-btn.active { color: var(--navy); border-bottom-color: var(--navy); }

.tab-panel { display: none; }
.tab-panel.active { display: block; }

.section-lbl {
  font-size: 0.88rem;
  font-weight: 700;
  color: var(--navy);
  margin: 0 0 0.5rem;
}

.tbl-wrap {
  overflow-x: auto;
  border-radius: 6px;
  box-shadow: 0 1px 4px rgba(0,0,0,0.08);
}

/* Monthly mirror: stretch to full main column — no bottom scrollbar on wide viewports. */
.tbl-wrap-xlsx {
  overflow-x: visible;
  width: 100%;
}

.xlsx-tbl {
  width: 100%;
  table-layout: fixed;
}

.xlsx-tbl td,
.xlsx-tbl th {
  overflow: hidden;
  text-overflow: ellipsis;
}

table { width: 100%; border-collapse: collapse; font-size: 0.76rem; }
th, td { border: 1px solid var(--border); padding: 0.26rem 0.4rem; white-space: nowrap; }
.xlsx-tbl td, .xlsx-tbl th { padding: 0.26rem 0.22rem; }
th { background: var(--navy); color: var(--white); text-align: center; font-size: 0.7rem; }
td { text-align: right; }
.sticky-col { position: sticky; left: 0; z-index: 2; background: inherit; text-align: left !important; }
th.sticky-col { background: var(--navy); }

.row-plat th { background: var(--mid); }
.row-plat .sticky-col { background: var(--mid); }
.row-alt { background: var(--alt); }
.row-alt .sticky-col { background: var(--alt); }
.row-sub td { background: var(--lite); font-style: italic; }
.row-sub .sticky-col { background: var(--lite); }
.row-total td { background: var(--navy); color: var(--white); font-weight: 700; }
.row-total .sticky-col { background: var(--navy); }
.row-avg td { background: var(--mid); color: var(--white); font-weight: 700; }
.row-avg .sticky-col { background: var(--mid); }
.col-red { color: #fff !important; font-weight: 600; }
.col-red-hdr { color: #fff !important; }

.xlsx-tbl .group-hdr { background: var(--mid); font-size: 0.68rem; }
.xlsx-tbl .col-sub { background: #d4d8dd !important; color: #1a5c1a !important; font-weight: 700; }
.xlsx-tbl th.col-sub { background: var(--navy) !important; color: #fff; }
.xlsx-tbl .col-grand { background: #d4d8dd !important; color: var(--navy) !important; font-weight: 700; }
.xlsx-tbl th.col-grand { background: var(--navy) !important; color: #fff; }
.xlsx-tbl .row-label { font-size: 0.72rem; font-weight: 600; color: #333; min-width: 0; width: 2.4rem; }
.xlsx-tbl td.dim { color: #bbb; }
.xlsx-tbl .row-bal td, .xlsx-tbl .row-pd td, .xlsx-tbl .row-proj td { background: #fff; }
.xlsx-tbl .row-today td { background: #fff; color: var(--navy); font-weight: 700; }
.xlsx-tbl .row-today .sticky-col { background: #fff; color: var(--navy); }
.xlsx-tbl .day-row td { background: var(--white); }
.xlsx-tbl .today-row td { background: var(--today) !important; font-weight: 600; }
.xlsx-tbl .today-row .sticky-col { background: var(--today) !important; }
.xlsx-tbl .row-mtd td { background: var(--lite); font-weight: 700; color: var(--navy); }
.xlsx-tbl .row-mtd .sticky-col { background: var(--lite); color: var(--navy); }
.xlsx-tbl .row-avg-d td { background: #f5f5f5; font-style: italic; }

.dim { color: #bbb; }
.footnote { margin-top: 0.75rem; font-size: 0.7rem; color: #999; }

#tab-monthly h3.monthly-section-title {
  font-size: 3rem !important;
  font-weight: 700 !important;
  margin: 0 0 0.75rem;
  color: #ffffff !important;
  background: #1a2744 !important;
  padding: 0.6rem 1.25rem;
  letter-spacing: 0.04em;
  line-height: 1.15;
  border-radius: 4px;
}

html.dark #tab-monthly h3.monthly-section-title {
  color: #ffffff !important;
  background: #1a2744 !important;
}

.monthly-section + .monthly-section {
  margin-top: 2in;
}

#tab-monthly {
  padding-bottom: 2rem;
}

.page { max-width: none; width: 100%; margin: 0 auto; padding: 1.25rem 1rem 3rem; }

.page-layout {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: 1.25rem;
}

.page-sidebar {
  flex: 0 0 11rem;
  padding: 0.85rem 0.7rem;
  background: #111318;
  border: 1px solid #2a2f38;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.18);
  position: sticky;
  top: 0.75rem;
  align-self: flex-start;
  max-height: calc(100vh - 1.5rem);
  overflow-y: auto;
  /* Top of sidebar = Update Now, aligned with Acct | Today header row. */
  margin-top: var(--today-toolbar-offset);
}

.sidebar-refresh {
  margin-bottom: 0.7rem;
}

.page-sidebar .sidebar-refresh .refresh-btn {
  width: 100%;
  padding: 0.38rem 0.5rem;
  font-size: 0.74rem;
}

.page-sidebar .section-lbl {
  color: #f0f2f5;
  margin-bottom: 0.7rem;
  font-size: 0.82rem;
  letter-spacing: 0.02em;
}

.page-main {
  flex: 1;
  min-width: 0;
}

.sidebar-tabs {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  margin-top: 0.85rem;
  padding-top: 0.75rem;
  border-top: 1px solid #3d4551;
}

.page-sidebar .sidebar-tabs .tab-btn {
  display: block;
  width: 100%;
  text-align: left;
  border: none;
  border-bottom: none;
  border-left: 2px solid transparent;
  margin: 0;
  padding: 0.42rem 0.5rem;
  font-size: 0.76rem;
  font-weight: 600;
  color: #8b95a8;
  background: none;
  border-radius: 4px;
  cursor: pointer;
  white-space: nowrap;
}

.page-sidebar .sidebar-tabs .tab-btn:hover {
  color: #e8edf5;
  background: #1e2430;
}

.page-sidebar .sidebar-tabs .tab-btn.active {
  color: #fff;
  border-left-color: #fff;
  border-bottom-color: transparent;
  background: #2a2f38;
}

.today-wrap { max-width: none; margin: 0; }

.today-plat-stack {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.today-plat-tbl,
.today-grand-tbl,
.today-col-hdr-tbl {
  width: 100%;
  max-width: 440px;
  border-collapse: collapse;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
  table-layout: fixed;
}

.today-col-hdr-tbl {
  margin-bottom: 0.35rem;
  box-shadow: none;
}

.today-plat-tbl {
  box-shadow: none;
}

.today-plat-tbl + .today-plat-tbl {
  margin-top: 0.15rem;
}

.today-toolbar {
  max-width: 440px;
  min-height: var(--today-toolbar-offset);
  margin: 0 0 0.5rem;
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
}

.today-source-btn {
  background: var(--plat-hdr);
  color: #f0f2f5;
  border: none;
  border-radius: 5px;
  padding: 0.3rem 0.7rem;
  font-size: 0.75rem;
  font-weight: 600;
  cursor: pointer;
}

.today-source-btn:hover { opacity: 0.92; }

.today-wrap:not(.show-source) .td-src { display: none; }

.today-tbl { width: 100%; border-collapse: collapse; table-layout: fixed; }
.today-tbl td, .today-tbl th { padding: 0.35rem 0.55rem; font-size: 0.85rem; border-bottom: 1px solid var(--border); }
.today-tbl .col-acct { width: 13%; }
.today-tbl .col-num { width: 29%; }
.today-tbl .col-src { width: 0; }
.today-wrap.show-source .col-src { width: 24%; }
.today-wrap.show-source .col-num { width: 21%; }
.td-lbl { text-align: left; color: #555; }
.td-val {
  text-align: right;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  padding-right: 0.65rem;
}
.td-src { text-align: left; font-size: 0.72rem; color: #666; font-family: ui-monospace, monospace; }
.td-col-hdr th { background: var(--mid); color: #fff; font-size: 0.75rem; text-align: right; border: none; }
.td-col-hdr th.td-lbl { text-align: left; }
.td-plat-hdr td {
  background: var(--plat-hdr);
  color: #f0f2f5;
  font-weight: 700;
  text-align: center;
  border: none;
  letter-spacing: 0.06em;
}
.td-sub-tot td { background: #eceef2; font-weight: 700; color: #2c3340; }
.td-spacer td { height: 0.5rem; border: none; background: transparent; }
.td-grand-mtd td { background: var(--mid); color: #fff !important; font-weight: 700; border: none; }

.bal-editable { cursor: pointer; position: relative; }
.bal-editable:hover { background: var(--today) !important; }
.edit-pen { font-size: 0.6rem; opacity: 0.4; margin-left: 2px; vertical-align: super; }
.bal-editable:hover .edit-pen { opacity: 0.9; }
.bal-edit-input { width: 4.75rem; font-size: 0.78rem; padding: 1px 4px; }
html.dark .bal-editable:hover { background: #1a2000 !important; }

.summary-plat-hdr td {
  background: var(--sub-bg);
  font-weight: 700;
  color: var(--navy);
  text-align: left;
}

.summary-tbl .sticky-col { min-width: 80px; }
.grand-row td { font-size: 0.82rem; }

.pmts-tbl .num { text-align: right; font-variant-numeric: tabular-nums; }
.pmts-date-hdr td { background: var(--lite); font-weight: 700; color: var(--navy); }
.pmts-grand td { background: var(--navy); color: #fff; font-weight: 700; }
.pmts-badge {
  display: inline-block;
  margin-left: 0.4rem;
  font-size: 0.65rem;
  padding: 0.1rem 0.35rem;
  border-radius: 3px;
  background: #eee;
  color: #333;
  font-weight: 600;
}

.formula-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 1.25rem 1.5rem;
  max-width: 720px;
}

.formula-card h3 {
  color: var(--navy);
  font-size: 1rem;
  margin: 1.25rem 0 0.5rem;
}

.formula-card h3:first-child { margin-top: 0; }

.formula-card dl { margin: 0; }
.formula-card dt { font-weight: 700; color: var(--mid); margin-top: 0.75rem; }
.formula-card dd { margin: 0.25rem 0 0 0; color: #444; line-height: 1.5; }
.formula-card ol, .formula-card ul { margin: 0.35rem 0 0 1.25rem; }
.formula-card li { margin: 0.25rem 0; }

.ph-actions {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  flex-wrap: wrap;
}

.theme-btn {
  background: var(--navy);
  color: #fff;
  border: none;
  border-radius: 5px;
  padding: 0.35rem 0.75rem;
  font-size: 0.78rem;
  font-weight: 600;
  cursor: pointer;
  opacity: 0.9;
  white-space: nowrap;
}

.theme-btn:hover { opacity: 1; }

.refresh-btn {
  background: var(--ok);
  color: #fff;
  border: none;
  border-radius: 5px;
  padding: 0.35rem 0.85rem;
  font-size: 0.78rem;
  font-weight: 600;
  cursor: pointer;
  opacity: 0.92;
}

.refresh-btn:hover { opacity: 1; }
.refresh-btn.spinning { opacity: 0.65; pointer-events: none; }

.refresh-accounts {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  margin: 0;
  max-width: none;
}

.refresh-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.35rem;
}

.page-sidebar .acct-btn {
  background: #2a2f38;
  color: #e8edf5;
  border-color: #3d4551;
  padding: 0.3rem 0.2rem;
  font-size: 0.7rem;
}

.page-sidebar .acct-btn:hover {
  background: #323a48;
  border-color: #5a6a85;
  color: #fff;
}

.acct-btn {
  background: var(--white);
  color: var(--navy);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 0.28rem 0.35rem;
  font-size: 0.72rem;
  font-weight: 600;
  cursor: pointer;
  line-height: 1.2;
  text-align: center;
  transition: background 0.12s, border-color 0.12s, color 0.12s;
}

.acct-btn:hover {
  background: var(--lite);
  border-color: var(--mid);
  color: var(--navy);
}

.acct-btn:active {
  background: var(--sub-bg);
}

html.dark .acct-btn {
  background: #252b36;
  color: #e8edf5;
  border-color: #3d4551;
}

html.dark .acct-btn:hover {
  background: #323a48;
  border-color: #5a6a85;
  color: #fff;
}

@media (max-width: 520px) {
  .page-layout { flex-direction: column; }
  .page-sidebar {
    position: static;
    flex: none;
    width: 100%;
    max-width: none;
    max-height: none;
  }
  .today-plat-tbl, .today-grand-tbl, .today-toolbar { max-width: 100%; }
}

@media (max-width: 640px) {
  .live-status { white-space: normal; }
  .tab-btn { padding: 0.45rem 0.65rem; font-size: 0.8rem; }
  .ph-actions { width: 100%; justify-content: space-between; }
  .tbl-wrap-xlsx { overflow-x: auto; }
}

.login-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  padding: 1rem;
}

.login-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 10px;
  box-shadow: 0 4px 24px rgba(0,0,0,0.1);
  padding: 2rem 1.75rem;
  width: min(360px, 100%);
}

.login-card h1 {
  font-size: 1.2rem;
  color: var(--navy);
  text-align: center;
  margin-bottom: 0.25rem;
}

.login-card input[type=password] {
  width: 100%;
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 0.55rem 0.75rem;
  font-size: 1rem;
  margin-bottom: 0.75rem;
}

.login-card button {
  width: 100%;
  background: var(--navy);
  color: #fff;
  border: none;
  border-radius: 6px;
  padding: 0.6rem;
  font-size: 1rem;
  cursor: pointer;
}

.login-card button:hover { background: var(--mid); }
.login-err { color: #c0392b; font-size: 0.85rem; text-align: center; margin-bottom: 0.75rem; }

html.dark .login-card { background: #111; border-color: #333; color: #eee; }
html.dark .login-card h1 { color: #fff; }
html.dark .login-card input[type=password] { background: #1a1a1a; color: #fff; border-color: #444; }

/* ── Dark mode ── */
html.dark body { background: #000; color: #fff; }

html.dark .theme-btn { background: #2a2f38; color: #eee; border: 1px solid #444; }
html.dark .today-source-btn { background: #2a2f38; color: #e8eaee; border: 1px solid #444; }
html.dark .page-sidebar { background: #0d0f14; border-color: #252b36; }

html.dark .ph h1 { color: #fff; }
html.dark .sub { color: #aaa; }
html.dark .badge-demo { background: #1a2a44; color: #9ec5fe; }
html.dark .badge-live { background: #0a2a10; color: #5ddc7a; }
html.dark .meta-row { color: #aaa; }
html.dark .meta-item { color: #888; }
html.dark .refresh-hint { color: #7fa8e0; }
html.dark .section-lbl { color: #ddd; }
html.dark .footnote { color: #666; }
html.dark .tabs { border-bottom-color: #333; }
html.dark .tab-btn { color: #777; }
html.dark .tab-btn:hover { color: #fff; }
html.dark .tab-btn.active { color: #fff; border-bottom-color: #fff; }

html.dark .live-status {
  background: #111;
  border-color: #333;
  color: #777;
}
html.dark .live-status .ls-date { color: #ccc; }
html.dark .live-status .ls-val { color: #f0c040; }
html.dark .live-status .ls-lbl { color: #fff; }
html.dark .live-status .ls-sep { color: #444; }
html.dark .ls-countdown { color: #7fa8e0; }

html.dark .alert-error {
  background: #2a1215;
  border-color: #5c2a30;
  color: #f5b7bd;
}
html.dark .alert-hint { color: #aaa; }
html.dark code { background: rgba(255,255,255,0.08); color: #ddd; }

html.dark table { border-color: #2a2a2a; }
html.dark th, html.dark td { border-color: #2a2a2a; }
html.dark th { background: #111; color: #fff; }
html.dark th.sticky-col { background: #111; }
html.dark td { color: #fff; }
html.dark .sticky-col { background: #000; }
html.dark .tbl-wrap { box-shadow: 0 1px 4px rgba(255,255,255,0.05); }

html.dark .row-plat th { background: #1a1a1a; color: #ddd; }
html.dark .row-plat .sticky-col { background: #1a1a1a; }
html.dark .row-alt { background: #080808; }
html.dark .row-alt .sticky-col { background: #080808; }
html.dark .row-sub td { background: #111; color: #fff; font-style: italic; }
html.dark .row-sub .sticky-col { background: #111; color: #fff; }
html.dark .row-total td { background: #0d0000; color: #fff; font-weight: 700; }
html.dark .row-total .sticky-col { background: #0d0000; color: #fff; }
html.dark .row-avg td { background: #0d0000; color: #fff; font-weight: 700; }
html.dark .row-avg .sticky-col { background: #0d0000; color: #fff; }
html.dark .col-red { color: #fff !important; }
html.dark .col-red-hdr { color: #fff !important; }

html.dark .xlsx-tbl .group-hdr { background: #111; color: #bbb; }
html.dark .xlsx-tbl .col-sub { background: #2a2f38 !important; color: #fff !important; }
html.dark .xlsx-tbl .col-grand { background: #2a2f38 !important; color: #fff !important; }
html.dark .xlsx-tbl .row-label { color: #ddd; background: inherit; }
html.dark .xlsx-tbl td.dim { color: #444; }
html.dark .xlsx-tbl .row-bal td { background: #080a18; }
html.dark .xlsx-tbl .row-bal .sticky-col { background: #080a18; }
html.dark .xlsx-tbl .row-pd td { background: #08120a; }
html.dark .xlsx-tbl .row-pd .sticky-col { background: #08120a; }
html.dark .xlsx-tbl .row-proj td { background: #2a2f38; color: #fff; }
html.dark .xlsx-tbl .row-proj .sticky-col { background: #2a2f38; color: #fff; }
html.dark .xlsx-tbl .row-today td { background: #2a2f38; color: #fff; }
html.dark .xlsx-tbl .row-today .sticky-col { background: #2a2f38; color: #fff; }
html.dark .xlsx-tbl .day-row td { background: #000; }
html.dark .xlsx-tbl .day-row .sticky-col { background: #000; }
html.dark .xlsx-tbl .today-row td { background: #0d0000 !important; font-weight: 600; color: #fff; }
html.dark .xlsx-tbl .today-row .sticky-col { background: #0d0000 !important; color: #fff; }
html.dark .xlsx-tbl .row-mtd td { background: #0d0000; color: #fff; font-weight: 700; }
html.dark .xlsx-tbl .row-mtd .sticky-col { background: #0d0000; color: #fff; }
html.dark .xlsx-tbl .row-avg-d td { background: #080808; color: #aaa; font-style: italic; }
html.dark .xlsx-tbl .row-avg-d .sticky-col { background: #080808; color: #aaa; }

html.dark .td-lbl { color: #aaa; }
html.dark .td-val { color: #eee; }
html.dark .td-src { color: #888; }
html.dark .td-col-hdr th { background: #1a2a3a; }
html.dark .td-plat-hdr td { background: #2a2f38; color: #e8eaee; }
html.dark .td-sub-tot td { background: #1a1f28; color: #d0d4dc; }
html.dark .td-acct-row:hover td { background: #1a2a3a; }
html.dark .td-grand-mtd td { background: #1e3a5a; color: #fff !important; }

html.dark .summary-plat-hdr td { background: #111; color: #ccc; }
html.dark .dim { color: #555; }

html.dark .audit-plat td { background: #111; color: #ccc; }
html.dark .audit-tbl .formula-cell { color: #aaa; }
html.dark .audit-tbl .src-cell { color: #888; }
html.dark .audit-tbl .audit-today { color: #fff; }
html.dark .audit-diff-warn { color: #ff6666 !important; }

html.dark .pmts-date-hdr td { background: #111; color: #ddd; }
html.dark .pmts-grand td { background: #0a0a18; color: #ccd; }
html.dark .pmts-badge { background: #333; color: #ddd; }

html.dark .formula-card {
  background: #0d0d0d;
  border-color: #333;
  color: #ddd;
}
html.dark .formula-card h3 { color: #eee; }
html.dark .formula-card dt { color: #9ec5fe; }
html.dark .formula-card dd { color: #bbb; }