:root {
  color-scheme: dark;
  --bg: #050914;
  --bg2: #07111f;
  --surface: rgba(9, 16, 31, 0.86);
  --surface2: rgba(14, 24, 44, 0.82);
  --surface3: rgba(18, 31, 55, 0.88);
  --glass: rgba(255, 255, 255, 0.055);
  --glass2: rgba(255, 255, 255, 0.085);
  --text: #f1f7ff;
  --soft: #d8e5f7;
  --muted: #91a5c3;
  --faint: #60718e;
  --line: rgba(151, 178, 214, 0.16);
  --line2: rgba(151, 178, 214, 0.28);
  --brand: #6d8dff;
  --brand2: #37e6c0;
  --brand3: #a96dff;
  --brand4: #3ab7ff;
  --good: #5cf0b2;
  --warn: #ffd166;
  --bad: #ff5f7c;
  --radius: 22px;
  --radius2: 15px;
  --shadow: 0 26px 90px rgba(0, 0, 0, 0.38);
  --shadow2: 0 14px 42px rgba(0, 0, 0, 0.26);
  --shadowGlow: 0 18px 80px rgba(55, 230, 192, 0.10), 0 12px 50px rgba(109, 141, 255, 0.08);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { min-height: 100%; background: var(--bg); scroll-behavior: smooth; }
body {
  margin: 0;
  min-height: 100vh;
  color: var(--text);
  letter-spacing: -0.016em;
  background:
    linear-gradient(180deg, rgba(7, 17, 31, 0.16), rgba(5, 9, 20, 0.98) 38rem),
    radial-gradient(circle at 5% -6%, rgba(109, 141, 255, 0.48) 0, transparent 32rem),
    radial-gradient(circle at 92% 6%, rgba(55, 230, 192, 0.34) 0, transparent 38rem),
    radial-gradient(circle at 52% 110%, rgba(169, 109, 255, 0.23) 0, transparent 35rem),
    var(--bg);
  overflow-x: hidden;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(rgba(255,255,255,.032) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.024) 1px, transparent 1px);
  background-size: 72px 72px;
  mask-image: linear-gradient(to bottom, rgba(0,0,0,.8), transparent 68%);
  opacity: .55;
}
body::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(255,255,255,0.035), transparent 18rem), radial-gradient(circle at 50% 0, rgba(255,255,255,0.08), transparent 32rem);
  opacity: .5;
}

button, input, textarea, select { font: inherit; }
button {
  border: 0;
  border-radius: 14px;
  padding: 0.84rem 1.05rem;
  background: linear-gradient(135deg, var(--brand2), var(--brand4));
  color: #04111c;
  font-weight: 950;
  cursor: pointer;
  box-shadow: 0 12px 26px rgba(55,230,192,0.16), inset 0 1px 0 rgba(255,255,255,0.35);
  transition: transform .16s ease, box-shadow .16s ease, opacity .16s ease, background .16s ease;
}
button:hover { transform: translateY(-1px); box-shadow: 0 16px 34px rgba(55,230,192,0.22), inset 0 1px 0 rgba(255,255,255,0.35); }
button:active { transform: translateY(0); }
button.ghost {
  background: rgba(255,255,255,0.07);
  color: var(--soft);
  border: 1px solid var(--line);
  box-shadow: none;
}
button.ghost:hover { background: rgba(255,255,255,0.105); border-color: rgba(55,230,192,0.34); }
button:disabled { opacity: 0.45; cursor: not-allowed; transform: none; }
input, textarea, select {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 0.9rem 1rem;
  background: rgba(4, 10, 22, 0.70);
  color: var(--text);
  outline: none;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.035);
}
input:focus, textarea:focus, select:focus { border-color: rgba(55,230,192,0.56); box-shadow: 0 0 0 4px rgba(55,230,192,0.10), inset 0 1px 0 rgba(255,255,255,0.035); }
textarea { resize: vertical; }
label { color: var(--muted); font-size: 0.9rem; font-weight: 750; }
label span { display: block; color: var(--muted); font-size: 0.9rem; margin-bottom: 0.42rem; }
a { color: inherit; }
code { color: var(--brand2); }

.bg span { position: fixed; width: 32rem; height: 32rem; border-radius: 999px; filter: blur(95px); opacity: 0.18; pointer-events: none; }
.bg span:nth-child(1) { background: var(--brand); left: -10rem; top: 8rem; }
.bg span:nth-child(2) { background: var(--brand2); right: -9rem; top: 16rem; }
.bg span:nth-child(3) { background: var(--brand3); left: 46%; bottom: -18rem; }

.topbar {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: 64px;
  padding: 0.68rem max(1rem, calc((100vw - 1680px) / 2 + 1.2rem));
  background: rgba(4, 8, 17, 0.78);
  backdrop-filter: blur(24px) saturate(140%);
  border-bottom: 1px solid rgba(151,178,214,0.13);
  box-shadow: 0 14px 46px rgba(0,0,0,0.26);
}
.brand { display: inline-flex; align-items: center; gap: 0.78rem; text-decoration: none; }
.brand strong { display: block; font-size: 1rem; letter-spacing: -0.03em; }
.brand small { display: block; color: var(--muted); line-height: 1.1; font-size: 0.78rem; }
.mark {
  display: grid;
  place-items: center;
  width: 2.55rem;
  height: 2.55rem;
  border-radius: 15px;
  color: #06111c;
  font-weight: 1000;
  background: linear-gradient(135deg, #7bc7ff, var(--brand2));
  box-shadow: 0 13px 34px rgba(55,230,192,0.25), inset 0 1px 0 rgba(255,255,255,.45);
}
.topRight { display: flex; align-items: center; gap: 0.62rem; justify-content: flex-end; flex-wrap: wrap; }
.email { color: var(--muted); max-width: 22rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 700; }
.status, .pill {
  display: inline-flex;
  align-items: center;
  gap: .42rem;
  border-radius: 999px;
  padding: 0.42rem 0.76rem;
  background: rgba(255,255,255,0.075);
  border: 1px solid var(--line);
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 900;
  white-space: nowrap;
}
.status.good, .pill.good { color: var(--good); border-color: rgba(92,240,178,0.35); background: rgba(92,240,178,0.10); }
.status.bad, .message.error { color: #ffdbe2; border-color: rgba(255,95,124,0.48); background: rgba(255,95,124,0.13); }
.pill.warn { color: var(--warn); border-color: rgba(255,209,102,0.35); background: rgba(255,209,102,0.10); }
.status.good::before { content: ""; width: .42rem; height: .42rem; border-radius: 50%; background: var(--good); box-shadow: 0 0 16px var(--good); }
.message {
  max-width: 1680px;
  width: calc(100% - clamp(1.5rem, 4vw, 3rem));
  margin: 1rem auto 0;
  border: 1px solid rgba(109,141,255,0.34);
  background: linear-gradient(135deg, rgba(109,141,255,0.18), rgba(55,230,192,0.08));
  color: #dbe7ff;
  padding: 0.95rem 1.1rem;
  border-radius: 18px;
  box-shadow: var(--shadow2);
}

.authShell {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(360px, .55fr);
  gap: 1.1rem;
  align-items: stretch;
  max-width: 1480px;
  margin: 0 auto;
  padding: clamp(1.2rem, 4vw, 4rem);
}
.authHero, .authCard, .panel, .metric, .goalCard, .warningBox, .empty, .sideCard {
  position: relative;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: linear-gradient(180deg, rgba(16, 28, 50, 0.82), rgba(7, 14, 27, 0.92));
  box-shadow: var(--shadow2);
  overflow: hidden;
}
.authHero::before, .pageHero::before, .panel::before, .metric::before, .goalCard::before, .miniCard::before, .sideCard::before, .empty::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(135deg, rgba(255,255,255,0.085), transparent 20%, transparent 72%, rgba(55,230,192,0.035));
}
.authHero::after, .pageHero::after, .metric.accent::after {
  content: "";
  position: absolute;
  width: 28rem;
  height: 28rem;
  right: -12rem;
  top: -12rem;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(55,230,192,0.22), transparent 62%);
  pointer-events: none;
}
.authHero { padding: clamp(2rem, 4.5vw, 4.4rem); min-height: 30rem; display: flex; flex-direction: column; justify-content: center; }
.authHero h1, .pageHero h1 { font-size: clamp(2.45rem, 5vw, 4.7rem); line-height: .92; margin: .36rem 0 1rem; letter-spacing: -.075em; }
.authHero p, .pageHero p { color: var(--soft); max-width: 58rem; line-height: 1.58; }
.eyebrow { position: relative; z-index: 1; color: var(--brand2); text-transform: uppercase; letter-spacing: .18em; font-size: .73rem; font-weight: 1000; }
.authCard { padding: 1.45rem; display: grid; gap: .86rem; align-content: center; }
.authCard.wide { max-width: 52rem; margin: 5rem auto; }

.layout {
  display: grid;
  grid-template-columns: 258px minmax(0, 1fr);
  gap: 1.1rem;
  max-width: 1680px;
  margin: 0 auto;
  padding: 1.05rem clamp(1rem, 2.2vw, 1.6rem) 2.4rem;
}
.sidebar { position: sticky; top: 5.25rem; align-self: start; display: grid; gap: 1rem; }
.sidebar nav, .sideCard {
  border: 1px solid var(--line);
  border-radius: 24px;
  background: linear-gradient(180deg, rgba(13, 25, 47, 0.82), rgba(5, 12, 24, 0.86));
  box-shadow: var(--shadow2);
  backdrop-filter: blur(18px) saturate(130%);
}
.sidebar nav { padding: .58rem; display: grid; gap: .16rem; }
.sidebar nav a {
  position: relative;
  display: flex;
  align-items: center;
  gap: .76rem;
  padding: .78rem .82rem;
  border-radius: 16px;
  color: var(--muted);
  text-decoration: none;
  font-weight: 900;
  transition: transform .16s ease, color .16s ease, background .16s ease;
}
.sidebar nav a::before {
  content: "";
  position: absolute;
  left: .2rem;
  top: 50%;
  width: 3px;
  height: 0;
  border-radius: 999px;
  background: linear-gradient(180deg, var(--brand2), var(--brand));
  transform: translateY(-50%);
  transition: height .18s ease;
}
.sidebar nav a:hover { color: var(--text); background: rgba(255,255,255,.055); transform: translateX(2px); }
.sidebar nav a.active {
  color: var(--text);
  background: linear-gradient(135deg, rgba(109,141,255,.26), rgba(55,230,192,.13));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}
.sidebar nav a.active::before { height: 62%; }
.navIcon {
  display: grid;
  place-items: center;
  width: 2.05rem;
  height: 2.05rem;
  flex: 0 0 auto;
  border-radius: 12px;
  background: rgba(255,255,255,.06);
  color: var(--brand2);
  font-size: .92rem;
  font-weight: 1000;
}
.sidebar nav a.active .navIcon { background: rgba(92,240,178,.14); color: var(--good); }
.sideCard { padding: 1rem; color: var(--muted); display: grid; gap: .28rem; }
.sideCard strong { color: var(--text); word-break: break-word; line-height: 1.12; }
.sideCard span { line-height: 1.35; }
.legacyLink { color: var(--brand2); text-decoration: none; font-weight: 950; }
.legacyLink:hover { text-decoration: underline; }
.content { display: grid; gap: 1rem; min-width: 0; }

.pageHero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: end;
  min-height: 12.5rem;
  border: 1px solid rgba(151,178,214,0.18);
  border-radius: 30px;
  padding: clamp(1.45rem, 3vw, 2.4rem);
  background:
    linear-gradient(135deg, rgba(109,141,255,.24), rgba(55,230,192,.11)),
    radial-gradient(circle at 12% 0%, rgba(255,255,255,.10), transparent 26rem),
    rgba(10, 23, 44, .86);
  box-shadow: var(--shadowGlow);
  overflow: hidden;
}
.pageHero.compact { min-height: 8.8rem; }
.pageHero.compact h1 { font-size: clamp(2rem, 3.4vw, 3.35rem); }
.heroBadge { position: relative; z-index: 1; align-self: start; }
.pageHero h1 { max-width: 15ch; }
.pageHero p { margin-bottom: 0; }

.metricsGrid, .miniGrid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.metricsGrid .metric:first-child { grid-column: span 2; }
.miniGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.metric {
  padding: 1.08rem 1.12rem;
  min-height: 7.2rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: linear-gradient(180deg, rgba(16, 28, 50, .84), rgba(6, 14, 28, .90));
  transition: transform .16s ease, border-color .16s ease, background .16s ease;
}
.metric:hover, .panel:hover, .goalCard:hover, .miniCard:hover { border-color: rgba(55,230,192,.25); }
.metric small, .panelHead small { color: var(--muted); font-weight: 900; letter-spacing: .01em; }
.metric strong { display: block; font-size: clamp(1.7rem, 2.8vw, 2.75rem); letter-spacing: -.06em; margin: .24rem 0; line-height: .98; }
.metric span { color: var(--muted); font-size: .88rem; line-height: 1.35; }
.metric.accent {
  background:
    radial-gradient(circle at 92% 0%, rgba(55,230,192,.23), transparent 18rem),
    linear-gradient(135deg, rgba(109,141,255,.32), rgba(55,230,192,.15)),
    rgba(15, 29, 53, .9);
  border-color: rgba(92,240,178,.28);
}
.metric.accent strong { font-size: clamp(2.2rem, 3.8vw, 3.6rem); }
.twoCol { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.panel { padding: 1.12rem; }
.panelHead { position: relative; z-index: 1; display: flex; justify-content: space-between; gap: 1rem; align-items: flex-start; margin-bottom: 1rem; }
.panel h2 { margin: 0; font-size: 1.22rem; letter-spacing: -.04em; }
.panel h3 { margin-top: 0; }
.dataList { display: grid; grid-template-columns: max-content minmax(0,1fr); gap: .66rem 1rem; margin: 0; }
.dataList dt { color: var(--muted); font-weight: 850; }
.dataList dd { margin: 0; min-width: 0; overflow-wrap: anywhere; color: var(--soft); font-weight: 720; }
.dataList.small { font-size: .92rem; }
.goalList { display: grid; grid-template-columns: repeat(auto-fill, minmax(285px, 1fr)); gap: 1rem; }
.goalCard { padding: 1.05rem; }
.goalTop { display: flex; justify-content: space-between; gap: 1rem; align-items: center; position: relative; z-index: 1; }
.goalTop h3 { margin: 0; }
.bar { height: .62rem; border-radius: 999px; overflow: hidden; background: rgba(255,255,255,.09); margin: .7rem 0; box-shadow: inset 0 1px 4px rgba(0,0,0,.25); }
.bar i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--brand), var(--brand4) 45%, var(--brand2)); box-shadow: 0 0 18px rgba(55,230,192,.27); }
.goalNumbers { display: flex; align-items: baseline; gap: .45rem; margin-bottom: .9rem; }
.goalNumbers strong { font-size: 1.45rem; }
.goalNumbers span, .cleanList { color: var(--muted); }
.cleanList { margin: 0; padding-left: 1.2rem; line-height: 1.7; }
.warningBox { padding: 1rem; border-color: rgba(255,209,102,.42); background: rgba(255,209,102,.095); }
.empty { padding: 3rem 2rem; text-align: center; color: var(--muted); min-height: 15rem; display: grid; place-items: center; align-content: center; }
.empty h3 { margin: 0 0 .4rem; color: var(--text); }
.empty p { margin: 0; max-width: 42rem; }
.code { background: rgba(0,0,0,.32); border: 1px solid var(--line); border-radius: 17px; padding: 1rem; overflow: auto; white-space: pre-wrap; }
.errorText { color: var(--bad); }
.muted { color: var(--muted); }
.hint { color: var(--muted); font-size: .86rem; line-height: 1.35; margin-top: -.35rem; }
.buttonRow, .formActions { display: flex; gap: .72rem; flex-wrap: wrap; align-items: center; }
.formGrid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 1rem; }
.formGrid .full, label.full { grid-column: 1 / -1; }
.tableWrap { overflow: auto; border: 1px solid var(--line); border-radius: 20px; background: rgba(3,9,20,.42); box-shadow: inset 0 1px 0 rgba(255,255,255,.03); }
table { width: 100%; border-collapse: collapse; min-width: 760px; }
th, td { text-align: left; padding: .9rem 1rem; border-bottom: 1px solid var(--line); vertical-align: top; }
th { color: var(--faint); font-size: .78rem; text-transform: uppercase; letter-spacing: .1em; font-weight: 1000; }
tr:hover td { background: rgba(255,255,255,.028); }
td.right, th.right { text-align: right; }
td.out { color: var(--bad); }
td.in { color: var(--good); }
.compactRows { display: grid; gap: .66rem; }
.compactRows > div {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: center;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.04);
  border-radius: 16px;
  padding: .82rem .88rem;
}
.compactRows > div:hover { border-color: rgba(55,230,192,.24); background: rgba(255,255,255,.06); }
.compactRows span, .compactRows small { color: var(--muted); }
.cardsGrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1rem; }
.miniCard { position: relative; border: 1px solid var(--line); border-radius: 18px; padding: 1rem; background: rgba(255,255,255,.042); overflow: hidden; }
.miniCard.selected { border-color: rgba(92,240,178,.48); background: rgba(92,240,178,.085); }
.rowBetween { display: flex; justify-content: space-between; gap: 1rem; align-items: center; }
.progressWrap { display: grid; gap: .44rem; }
.progressLabel { display: flex; justify-content: space-between; gap: 1rem; color: var(--muted); font-size: .86rem; }
.progressLabel strong { color: var(--text); }
.goalList.single { grid-template-columns: 1fr; }
.holidayTabs {
  display: flex;
  gap: .5rem;
  flex-wrap: wrap;
  position: relative;
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: .42rem;
  background: rgba(255,255,255,.035);
}
.holidayTabs button { padding: .65rem .85rem; border-radius: 13px; }
.holidayTabs .active { color: #06111c; background: linear-gradient(135deg, var(--brand2), var(--brand4)); border-color: transparent; }
.checkGrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: .75rem; }
.checkGrid.slim { grid-template-columns: 1fr; }
.checkCard {
  display: flex;
  gap: .75rem;
  align-items: flex-start;
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: .86rem;
  background: rgba(255,255,255,.04);
  transition: border-color .16s ease, background .16s ease;
}
.checkCard:hover { border-color: rgba(55,230,192,.24); background: rgba(255,255,255,.06); }
.checkCard input { width: auto; margin-top: .18rem; accent-color: var(--brand2); }
.checkCard small { color: var(--muted); }

@media (min-width: 1500px) {
  .twoCol { gap: 1.15rem; }
  .panel { padding: 1.2rem; }
}
@media (max-width: 1180px) {
  .layout { grid-template-columns: 1fr; max-width: 100%; }
  .sidebar { position: static; }
  .sidebar nav { display: flex; overflow-x: auto; gap: .35rem; scrollbar-width: thin; }
  .sidebar nav a { min-width: max-content; }
  .sideCard { display: none; }
  .metricsGrid .metric:first-child { grid-column: span 1; }
}
@media (max-width: 980px) {
  .authShell, .twoCol { grid-template-columns: 1fr; }
  .metricsGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pageHero { grid-template-columns: 1fr; }
  .pageHero h1 { max-width: none; }
}
@media (max-width: 720px) {
  .formGrid { grid-template-columns: 1fr; }
  .compactRows > div { display: grid; }
  .rowBetween { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 620px) {
  .topbar { align-items: flex-start; flex-direction: column; padding: .75rem 1rem; }
  .topRight { justify-content: flex-start; }
  .layout { padding: .85rem; }
  .metricsGrid, .miniGrid { grid-template-columns: 1fr; }
  .authHero h1, .pageHero h1 { font-size: 2.35rem; }
  .authShell { padding: 1rem; }
  .pageHero, .panel, .metric { border-radius: 20px; }
}

/* v35 — bring Web v2 back toward the stronger old command-centre design */
:root {
  --old-bg: #050914;
  --old-card: rgba(13, 24, 45, 0.88);
  --old-card2: rgba(18, 31, 58, 0.88);
  --old-line: rgba(126, 153, 210, 0.19);
  --old-purple: #5a4df6;
  --old-purple2: #8757ff;
  --old-cyan: #34efc3;
  --old-blue: #5f7dff;
}
body {
  background:
    radial-gradient(circle at 80% 8%, rgba(38, 228, 190, 0.16), transparent 30rem),
    radial-gradient(circle at 16% 0%, rgba(93, 125, 255, 0.25), transparent 28rem),
    linear-gradient(180deg, #06101e 0%, #040915 34rem, #030712 100%);
}
body::before { opacity: 0.14; }
body::after { opacity: 0.18; }
.bg span { opacity: 0.09; }

.topbar {
  position: sticky;
  top: 0.7rem;
  max-width: 1280px;
  width: calc(100% - 2rem);
  min-height: 54px;
  margin: 0.7rem auto 0;
  padding: 0.48rem 0.62rem;
  border: 1px solid rgba(140, 164, 211, 0.20);
  border-radius: 20px;
  background: rgba(8, 16, 30, 0.86);
  box-shadow: 0 18px 60px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.05);
}
.mark { width: 2.35rem; height: 2.35rem; border-radius: 15px; background: linear-gradient(135deg, #705cff, #45e6d0); }
.brand strong { font-size: .95rem; }
.brand small { text-transform: uppercase; letter-spacing: .12em; font-size: .58rem; font-weight: 950; color: #aab8d4; }
.topRight button.ghost { padding: .62rem .82rem; border-radius: 13px; }
.status, .pill { padding: .34rem .68rem; font-size: .78rem; }

.layout {
  max-width: 1280px;
  grid-template-columns: 178px minmax(0, 1fr);
  gap: 1.05rem;
  padding: 1rem 1rem 3rem;
}
.sidebar { top: 5rem; gap: .85rem; }
.sidebar nav {
  border-radius: 22px;
  padding: .68rem;
  background: linear-gradient(180deg, rgba(17, 28, 54, .92), rgba(7, 13, 27, .92));
}
.sidebar nav::before {
  content: "Workspace";
  display: block;
  padding: .45rem .56rem .6rem;
  color: #8090ad;
  text-transform: uppercase;
  letter-spacing: .18em;
  font-size: .56rem;
  font-weight: 1000;
}
.sidebar nav a {
  padding: .68rem .62rem;
  border-radius: 14px;
  font-size: .88rem;
}
.sidebar nav a span:last-child { line-height: 1.05; }
.navIcon { width: 1.9rem; height: 1.9rem; border-radius: 11px; color: #aebdff; background: rgba(94, 125, 255, .15); }
.sidebar nav a.active {
  background: linear-gradient(135deg, rgba(70, 89, 255, .92), rgba(132, 82, 255, .92));
  color: #fff;
  box-shadow: 0 12px 28px rgba(91, 78, 246, .25), inset 0 1px 0 rgba(255,255,255,.16);
}
.sidebar nav a.active .navIcon { background: rgba(255,255,255,.14); color: white; }
.sidebar nav a::before { display: none; }
.sideCard {
  border-radius: 18px;
  padding: .85rem;
  font-size: .82rem;
  background: rgba(13, 24, 45, .82);
}
.content { gap: 1rem; }
.message { max-width: 1280px; width: calc(100% - 2rem); border-radius: 14px; padding: .78rem 1rem; }

.dashboardV35 { display: grid; gap: .9rem; }
.commandHero {
  min-height: 132px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 410px;
  gap: 1rem;
  align-items: center;
  padding: 1.55rem 1.65rem;
  border-radius: 26px;
  border: 1px solid rgba(126,153,210,.22);
  background:
    radial-gradient(circle at 96% 0%, rgba(108, 88, 255, .30), transparent 18rem),
    radial-gradient(circle at 20% 0%, rgba(68, 229, 211, .08), transparent 20rem),
    linear-gradient(135deg, rgba(20, 35, 69, .92), rgba(18, 35, 75, .72));
  box-shadow: 0 22px 70px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.07);
  overflow: hidden;
}
.commandHero h1 {
  margin: .2rem 0 .4rem;
  font-size: clamp(2.4rem, 4.2vw, 3.45rem);
  letter-spacing: -.075em;
  line-height: .94;
}
.commandHero p:not(.eyebrow) { margin: 0; color: #aebbd4; font-size: .95rem; }
.heroStatRail {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 18px;
  overflow: hidden;
  background: rgba(255,255,255,.075);
  backdrop-filter: blur(16px);
}
.heroStatRail div { padding: .82rem .9rem; border-right: 1px solid rgba(255,255,255,.11); }
.heroStatRail div:last-child { border-right: 0; }
.heroStatRail small { display: block; color: #bac6dc; font-weight: 850; font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; }
.heroStatRail strong { display: block; margin-top: .28rem; font-size: .96rem; line-height: 1.15; }
.periodBar {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 1rem;
  align-items: center;
  text-align: center;
  padding: .62rem;
  border: 1px solid rgba(126,153,210,.16);
  border-radius: 18px;
  background: rgba(9, 18, 34, .78);
}
.periodBar strong { display:block; font-size:.82rem; }
.periodBar span { display:block; color:#8898b5; font-size:.72rem; }
.periodButton {
  text-decoration: none;
  color: #dce8ff;
  font-weight: 950;
  font-size: .74rem;
  padding: .58rem .78rem;
  border: 1px solid rgba(126,153,210,.18);
  border-radius: 13px;
  background: rgba(255,255,255,.045);
}
.periodButton.disabled { opacity: .55; }
.mainOverviewGrid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 355px;
  gap: 1rem;
}
.safeHeroCard {
  position: relative;
  min-height: 250px;
  padding: 1.65rem;
  border: 1px solid rgba(143, 129, 255, .42);
  border-radius: 25px;
  overflow: hidden;
  background:
    radial-gradient(circle at 95% 8%, rgba(255,255,255,.22), transparent 18rem),
    radial-gradient(circle at 75% 90%, rgba(151, 95, 255, .30), transparent 18rem),
    linear-gradient(135deg, #3142d8 0%, #5947f3 48%, #8a56f3 100%);
  box-shadow: 0 24px 80px rgba(74, 65, 235, .22);
}
.safeHeroCard::before,
.safeHeroCard::after {
  content: "";
  position: absolute;
  border-radius: 999px;
  pointer-events: none;
  border: 1px solid rgba(255,255,255,.10);
}
.safeHeroCard::before { width: 270px; height: 270px; right: -70px; top: -90px; background: rgba(255,255,255,.06); }
.safeHeroCard::after { width: 170px; height: 170px; right: 145px; bottom: -90px; background: rgba(255,255,255,.05); }
.safeHeroTop { position: relative; z-index: 1; display: flex; justify-content: space-between; color: white; margin-bottom: 2rem; }
.safeHeroTop span { color: rgba(255,255,255,.72); font-size: .8rem; }
.safeHeroCard .eyebrow { color: rgba(255,255,255,.74); }
.safeHeroCard h2 { position: relative; z-index: 1; margin: .25rem 0 0; font-size: clamp(3.4rem, 6vw, 5.1rem); line-height: .92; letter-spacing: -.085em; }
.safeSubtitle { position: relative; z-index: 1; margin: .45rem 0 1rem; color: #8affdc; font-weight: 850; }
.miniButton {
  position: relative; z-index: 1;
  display: inline-flex;
  align-items: center;
  text-decoration: none;
  padding: .65rem .85rem;
  border-radius: 13px;
  background: rgba(255,255,255,.15);
  color: white;
  font-weight: 950;
  font-size: .78rem;
}
.safeHeroMiniStats {
  position: absolute;
  right: 1.2rem;
  bottom: 1.2rem;
  display: grid;
  grid-template-columns: repeat(2, 104px);
  gap: .65rem;
  z-index: 1;
}
.safeHeroMiniStats div {
  padding: .72rem;
  border-radius: 13px;
  background: rgba(18, 22, 80, .24);
  backdrop-filter: blur(12px);
}
.safeHeroMiniStats small { display:block; color: rgba(255,255,255,.68); font-size:.67rem; }
.safeHeroMiniStats strong { display:block; margin-top:.25rem; color:#fff; font-size:.88rem; }
.priorityStack {
  padding: 1.05rem;
  border: 1px solid rgba(126,153,210,.18);
  border-radius: 24px;
  background:
    linear-gradient(180deg, rgba(18, 28, 55, .88), rgba(10, 18, 36, .9));
  box-shadow: 0 18px 54px rgba(0,0,0,.24);
}
.priorityItem {
  display: grid;
  grid-template-columns: 34px minmax(0,1fr) auto;
  gap: .72rem;
  align-items: center;
  padding: .72rem;
  border: 1px solid rgba(126,153,210,.16);
  border-radius: 14px;
  background: rgba(255,255,255,.045);
  margin-bottom: .58rem;
}
.priorityIcon { display:grid; place-items:center; width:34px; height:34px; border-radius:11px; color:#74f3d1; background:rgba(52,239,195,.12); }
.priorityItem strong { display:block; font-size:.82rem; }
.priorityItem small { display:block; color:#94a5c4; font-size:.68rem; line-height:1.3; }
.priorityItem a { text-decoration:none; color:white; background:linear-gradient(135deg,#5b68ff,#8757ff); border-radius:10px; padding:.5rem .58rem; font-size:.68rem; font-weight:1000; }
.priorityItem.danger .priorityIcon { color:#ff8ba0; background:rgba(255,95,124,.12); }
.cashflowList { margin-top:.85rem; border-top:1px solid rgba(126,153,210,.14); padding-top:.8rem; }
.cashflowList h3 { margin:0; font-size:.9rem; }
.cashflowList > div:not(.rowBetween) { display:grid; grid-template-columns:44px 1fr auto; gap:.58rem; align-items:center; padding:.45rem 0; font-size:.75rem; }
.cashflowList span { color:#8a9ab8; }
.cashflowList em { color:#ff83a0; font-style:normal; font-weight:900; }
.statRibbon {
  display:grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap:.55rem;
}
.statRibbon article {
  position:relative;
  min-height:86px;
  padding:.85rem .78rem;
  border-radius:17px;
  border:1px solid rgba(126,153,210,.18);
  background:linear-gradient(180deg, rgba(16, 29, 54, .90), rgba(8, 17, 33, .92));
  overflow:hidden;
}
.statRibbon article::before { content:""; position:absolute; left:0; top:0; bottom:0; width:3px; background:#34efc3; }
.statRibbon article.warn::before { background:#ffb703; }
.statRibbon small { display:block; color:#91a1bf; font-size:.66rem; font-weight:850; }
.statRibbon strong { display:block; margin:.34rem 0 .18rem; color:#37efc3; font-size:1.05rem; letter-spacing:-.045em; }
.statRibbon span { display:block; color:#8899b8; font-size:.67rem; }
.dashboardLowerGrid {
  display:grid;
  grid-template-columns: 1.1fr 1.05fr 1fr;
  gap:1rem;
}
.dashboardLowerGrid .panel, .oldStyleBottom .panel { border-radius:22px; background:linear-gradient(180deg, rgba(16,29,54,.88), rgba(8,16,32,.92)); }
.miniGrid.tight { gap:.6rem; }
.miniGrid.tight .miniCard { border-radius:14px; padding:.75rem; }
.miniCard small { display:block; color:#91a1bf; font-size:.68rem; font-weight:850; }
.miniCard strong { display:block; margin-top:.25rem; font-size:1.05rem; color:#fff; }
.focusGoal { margin-bottom:.7rem; padding:1rem; border-radius:17px; background:linear-gradient(135deg,#4357ff,#7d51f4); }
.focusGoal small { display:block; color:rgba(255,255,255,.72); }
.focusGoal strong { display:block; font-size:1.35rem; margin:.24rem 0; }
.focusGoal span { color:white; font-weight:850; }
.queueRows > div { padding:.62rem .72rem; }
.velocityPanel .miniGrid { grid-template-columns: repeat(2, minmax(0,1fr)); }
.coachPanel .compactRows > div, .queueRows > div { background:rgba(255,255,255,.035); }
.oldStyleBottom { display:grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }

/* general v2 pages also get the more compact old-shell treatment */
.pageHero {
  min-height: 118px;
  border-radius: 24px;
  padding: 1.45rem 1.55rem;
  background: linear-gradient(135deg, rgba(48,66,143,.52), rgba(21,94,94,.24)), rgba(15,26,50,.88);
}
.pageHero h1 { font-size: clamp(2rem, 3.2vw, 3rem); max-width: 20ch; }
.pageHero p { font-size: .95rem; }
.metricsGrid { gap: .72rem; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.metricsGrid .metric:first-child { grid-column: span 1; }
.metric { min-height: 86px; padding: .9rem; border-radius: 17px; }
.metric strong { font-size: clamp(1.45rem, 2.2vw, 2.1rem); }
.metric.accent strong { font-size: clamp(1.65rem, 2.6vw, 2.45rem); }
.panel { border-radius: 21px; padding: 1rem; }
.twoCol { gap: 1rem; }
.tableWrap { border-radius: 16px; }
th, td { padding: .72rem .82rem; }
.compactRows > div { border-radius: 13px; padding: .7rem .76rem; }

@media (max-width: 1180px) {
  .topbar { width: calc(100% - 1rem); top: .5rem; }
  .layout { grid-template-columns: 1fr; max-width: 100%; }
  .sidebar nav::before { display:none; }
  .mainOverviewGrid, .dashboardLowerGrid, .commandHero { grid-template-columns: 1fr; }
  .heroStatRail { max-width: 520px; }
  .statRibbon { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .safeHeroMiniStats { position: relative; right: auto; bottom: auto; margin-top: 1rem; grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 760px) {
  .layout { padding: .75rem; }
  .commandHero { padding: 1.15rem; }
  .heroStatRail, .periodBar, .oldStyleBottom { grid-template-columns: 1fr; }
  .heroStatRail div { border-right:0; border-bottom:1px solid rgba(255,255,255,.11); }
  .heroStatRail div:last-child { border-bottom:0; }
  .safeHeroCard h2 { font-size: 3.15rem; }
  .statRibbon { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .dashboardLowerGrid { grid-template-columns:1fr; }
  .metricsGrid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 520px) {
  .statRibbon, .metricsGrid { grid-template-columns: 1fr; }
  .safeHeroCard { padding: 1.1rem; }
}

/* v36 — clean adult banking shell with top tabs, no left sidebar, no heavy dark-blue theme */
:root {
  color-scheme: light;
  --bg: #f4f6fb;
  --bg2: #edf2f7;
  --surface: rgba(255, 255, 255, 0.92);
  --surface2: rgba(248, 250, 252, 0.96);
  --surface3: #ffffff;
  --glass: rgba(15, 23, 42, 0.04);
  --glass2: rgba(15, 23, 42, 0.07);
  --text: #111827;
  --soft: #233044;
  --muted: #64748b;
  --faint: #94a3b8;
  --line: rgba(100, 116, 139, 0.18);
  --line2: rgba(100, 116, 139, 0.28);
  --brand: #4f46e5;
  --brand2: #0fba8c;
  --brand3: #7c3aed;
  --brand4: #0ea5e9;
  --good: #0fba8c;
  --warn: #d97706;
  --bad: #e11d48;
  --radius: 24px;
  --radius2: 16px;
  --shadow: 0 24px 70px rgba(15, 23, 42, 0.10);
  --shadow2: 0 14px 34px rgba(15, 23, 42, 0.08);
  --shadowGlow: 0 24px 70px rgba(15, 23, 42, 0.10);
}
html { background: var(--bg); }
body {
  color: var(--text);
  background:
    radial-gradient(circle at 12% -10%, rgba(79, 70, 229, 0.18), transparent 28rem),
    radial-gradient(circle at 88% 0%, rgba(15, 186, 140, 0.16), transparent 32rem),
    linear-gradient(180deg, #f8fafc 0%, #eef3f8 28rem, #f5f7fb 100%);
}
body::before { opacity: 0.18; background-size: 44px 44px; }
body::after, .bg { display: none; }
button {
  background: #111827;
  color: #ffffff;
  border-radius: 12px;
  box-shadow: 0 10px 24px rgba(17, 24, 39, 0.13);
}
button:hover { box-shadow: 0 14px 28px rgba(17,24,39,.16); }
button.ghost, .periodButton, .miniButton {
  background: #ffffff;
  color: #1e293b;
  border: 1px solid var(--line);
  box-shadow: 0 8px 22px rgba(15,23,42,.06);
}
button.ghost:hover, .periodButton:hover, .miniButton:hover { background: #f8fafc; border-color: rgba(15, 186, 140, 0.35); }
input, textarea, select {
  background: #ffffff;
  color: var(--text);
  border: 1px solid #d9e2ed;
  border-radius: 13px;
  box-shadow: inset 0 1px 0 rgba(15,23,42,.02);
}
input:focus, textarea:focus, select:focus { border-color: rgba(15, 186, 140, .62); box-shadow: 0 0 0 4px rgba(15,186,140,.12); }
label, label span, .hint, .muted { color: var(--muted); }
.legacyLink { color: #0f766e; }

.topbar {
  top: 0;
  max-width: none;
  width: 100%;
  margin: 0;
  min-height: 68px;
  border: 0;
  border-bottom: 1px solid rgba(100,116,139,.16);
  border-radius: 0;
  background: rgba(255,255,255,.88);
  color: var(--text);
  box-shadow: 0 10px 30px rgba(15,23,42,.06);
  padding: .74rem max(1.2rem, calc((100vw - 1480px) / 2 + 1.2rem));
}
.brand strong { color: #111827; font-size: 1.02rem; }
.brand small { color: #64748b; letter-spacing: .02em; text-transform: none; font-weight: 760; font-size: .78rem; }
.mark {
  background: linear-gradient(135deg, #111827, #334155);
  color: #ffffff;
  box-shadow: none;
  border-radius: 12px;
}
.topRight button.ghost { background: #f8fafc; color: #172033; }
.email { color: #475569; }
.status, .pill {
  color: #475569;
  background: #ffffff;
  border-color: #dbe4ef;
  box-shadow: 0 6px 16px rgba(15,23,42,.05);
}
.status.good, .pill.good { color: #0f766e; background: #ecfdf5; border-color: rgba(16,185,129,.30); }
.status.bad, .message.error { color: #9f1239; background: #fff1f2; border-color: #fecdd3; }
.message {
  max-width: 1480px;
  color: #1e3a8a;
  background: #eff6ff;
  border-color: #bfdbfe;
  box-shadow: none;
}

.appFrame {
  max-width: 1480px;
  margin: 0 auto;
  padding: 1rem clamp(1rem, 2.2vw, 1.8rem) 3rem;
  display: grid;
  gap: 1rem;
}
.topTabs {
  position: sticky;
  top: 78px;
  z-index: 15;
  display: flex;
  gap: .35rem;
  overflow-x: auto;
  scrollbar-width: thin;
  padding: .48rem;
  border: 1px solid rgba(100,116,139,.16);
  border-radius: 18px;
  background: rgba(255,255,255,.82);
  backdrop-filter: blur(18px) saturate(130%);
  box-shadow: 0 14px 34px rgba(15,23,42,.07);
}
.topTabs a {
  min-width: max-content;
  display: inline-flex;
  align-items: center;
  gap: .58rem;
  padding: .66rem .86rem;
  border-radius: 13px;
  text-decoration: none;
  color: #475569;
  font-weight: 900;
  transition: background .16s ease, color .16s ease, transform .16s ease;
}
.topTabs a:hover { background: #f1f5f9; color: #111827; }
.topTabs a.active {
  color: #ffffff;
  background: #111827;
  box-shadow: 0 12px 26px rgba(17,24,39,.16);
}
.topTabs .navIcon {
  width: 1.65rem;
  height: 1.65rem;
  border-radius: 9px;
  color: inherit;
  background: rgba(15,23,42,.06);
}
.topTabs a.active .navIcon { background: rgba(255,255,255,.14); color: #ffffff; }
.v2InfoBar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .7rem;
  padding: .75rem .95rem;
  border: 1px solid rgba(100,116,139,.14);
  border-radius: 16px;
  background: rgba(255,255,255,.72);
  color: #64748b;
  box-shadow: 0 12px 28px rgba(15,23,42,.05);
}
.v2InfoBar strong { color: #111827; }
.buildText { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .76rem; color: #94a3b8; }
.layout, .sidebar { display: none !important; }
.content { display: grid; gap: 1rem; min-width: 0; }

.authHero, .authCard, .panel, .metric, .goalCard, .warningBox, .empty, .sideCard, .miniCard {
  background: #ffffff;
  color: var(--text);
  border: 1px solid rgba(100,116,139,.14);
  box-shadow: var(--shadow2);
}
.authHero::before, .pageHero::before, .panel::before, .metric::before, .goalCard::before, .miniCard::before, .sideCard::before, .empty::before,
.authHero::after, .pageHero::after, .metric.accent::after { display: none; }
.authHero h1, .pageHero h1, .commandHero h1 { color: #111827; }
.authHero p, .pageHero p, .commandHero p:not(.eyebrow) { color: #64748b; }
.eyebrow { color: #0f766e; letter-spacing: .14em; }
.authShell { max-width: 1220px; }

.dashboardV35 { gap: 1rem; }
.commandHero {
  min-height: 210px;
  grid-template-columns: minmax(0, 1fr) 420px;
  border: 1px solid rgba(100,116,139,.14);
  border-radius: 28px;
  background:
    radial-gradient(circle at 95% 5%, rgba(15,186,140,.18), transparent 18rem),
    linear-gradient(135deg, #ffffff 0%, #f8fafc 55%, #eef6f3 100%);
  color: #111827;
  box-shadow: var(--shadow);
}
.commandHero h1 {
  max-width: 14ch;
  font-size: clamp(2.55rem, 4.8vw, 4.55rem);
  line-height: .92;
  letter-spacing: -.085em;
}
.heroStatRail {
  background: #111827;
  border: 0;
  box-shadow: 0 20px 50px rgba(17,24,39,.16);
}
.heroStatRail div { border-right-color: rgba(255,255,255,.11); }
.heroStatRail small { color: #a7b1c3; }
.heroStatRail strong { color: #ffffff; font-size: 1.1rem; }
.periodBar {
  background: #ffffff;
  border-color: rgba(100,116,139,.14);
  box-shadow: var(--shadow2);
  color: #111827;
}
.periodBar span { color: #64748b; }
.mainOverviewGrid { grid-template-columns: minmax(0, 1.1fr) minmax(330px, .58fr); }
.safeHeroCard {
  min-height: 270px;
  border: 0;
  background:
    radial-gradient(circle at 85% 12%, rgba(255,255,255,.16), transparent 16rem),
    linear-gradient(135deg, #111827 0%, #1f2937 45%, #0f766e 100%);
  box-shadow: 0 28px 70px rgba(17,24,39,.22);
}
.safeHeroCard h2 { color: #ffffff; }
.safeHeroTop, .safeSubtitle, .safeHeroMiniStats small { color: rgba(255,255,255,.72); }
.safeHeroMiniStats div { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.14); }
.safeHeroMiniStats strong { color: #ffffff; }
.priorityStack {
  background: #ffffff;
  border: 1px solid rgba(100,116,139,.14);
  color: #111827;
  box-shadow: var(--shadow2);
}
.priorityItem, .cashflowList div:not(.rowBetween), .compactRows > div {
  background: #f8fafc;
  border-color: rgba(100,116,139,.12);
  color: #111827;
}
.priorityItem a { background: #111827; color: white; }
.priorityItem small, .cashflowList span, .compactRows span, .compactRows small { color: #64748b; }
.priorityIcon { background: #ecfdf5; color: #0f766e; }
.cashflowList em { color: #be123c; }
.statRibbon { grid-template-columns: repeat(6, minmax(0,1fr)); gap: .74rem; }
.statRibbon article {
  background: #ffffff;
  border: 1px solid rgba(100,116,139,.13);
  color: #111827;
  border-radius: 18px;
  box-shadow: 0 12px 26px rgba(15,23,42,.06);
}
.statRibbon article::before { background: #0fba8c; opacity: .9; }
.statRibbon article.warn::before { background: #d97706; }
.statRibbon small, .statRibbon span { color: #64748b; }
.statRibbon strong { color: #0f766e; }
.statRibbon article.warn strong { color: #111827; }
.dashboardLowerGrid { grid-template-columns: 1fr 1fr 1fr; gap: 1rem; }
.panel {
  border-radius: 22px;
  background: #ffffff;
  box-shadow: var(--shadow2);
}
.panelHead small, .metric small, th { color: #64748b; }
.panel h2, .panel h3 { color: #111827; }
.miniCard { background: #f8fafc; }
.miniCard small { color: #64748b; }
.miniCard strong { color: #111827; }
.focusGoal {
  background: linear-gradient(135deg, #111827, #0f766e);
  color: white;
  border-radius: 18px;
}
.focusGoal small, .focusGoal span { color: rgba(255,255,255,.76); }
.tableWrap { background: #ffffff; border-color: rgba(100,116,139,.14); }
th, td { border-bottom-color: rgba(100,116,139,.12); color: #111827; }
tr:hover td { background: #f8fafc; }
.code { background: #f8fafc; color: #111827; border-color: rgba(100,116,139,.14); }
.holidayTabs { background: #ffffff; border-color: rgba(100,116,139,.14); box-shadow: var(--shadow2); }
.holidayTabs button { background: #f8fafc; color: #334155; box-shadow: none; }
.holidayTabs .active { color: #ffffff; background: #111827; }
.checkCard { background: #ffffff; border-color: rgba(100,116,139,.14); color: #111827; }
.checkCard:hover { background: #f8fafc; }
.checkCard small { color: #64748b; }
.bar { background: #e2e8f0; }
.bar i { background: linear-gradient(90deg, #111827, #0fba8c); box-shadow: none; }
.metric { background: #ffffff; }
.metric.accent {
  background: linear-gradient(135deg, #111827, #0f766e);
  color: white;
}
.metric.accent small, .metric.accent span { color: rgba(255,255,255,.70); }
.metric.accent strong { color: white; }
.empty { color: #64748b; }
.empty h3 { color: #111827; }

@media (max-width: 1200px) {
  .commandHero, .mainOverviewGrid { grid-template-columns: 1fr; }
  .heroStatRail { max-width: 620px; }
  .statRibbon { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .dashboardLowerGrid { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .topbar { align-items: flex-start; flex-direction: column; }
  .topTabs { top: 126px; }
  .statRibbon { grid-template-columns: 1fr; }
  .heroStatRail { grid-template-columns: 1fr; }
  .heroStatRail div { border-right: 0; border-bottom: 1px solid rgba(255,255,255,.11); }
  .commandHero h1 { font-size: 2.45rem; }
  .appFrame { padding: .8rem .8rem 2rem; }
}

/* v38 — restore the old full goals planner flow inside Web v2 */
.goalsHeroV38 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, .48fr); gap: 1rem; align-items: center; }
.goalHeroRail { margin-left: auto; width: 100%; max-width: 520px; }
.goalPlannerShellV38 { display: grid; gap: 1rem; }
.goalCapacityHeroV38 {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .85rem;
}
.goalModeHero {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: var(--surface3);
  box-shadow: var(--shadow2);
  padding: 1rem;
  min-height: 108px;
}
.goalModeHero::after {
  content: "";
  position: absolute;
  right: -3rem;
  top: -3rem;
  width: 9rem;
  height: 9rem;
  border-radius: 999px;
  background: rgba(15,186,140,.10);
  pointer-events: none;
}
.goalModeHero.active {
  color: #fff;
  background: linear-gradient(135deg, #111827, #0f766e);
  border-color: rgba(15,186,140,.36);
}
.goalModeHero span { display: block; color: var(--muted); font-weight: 900; font-size: .86rem; }
.goalModeHero.active span, .goalModeHero.active small { color: rgba(255,255,255,.75); }
.goalModeHero strong { display: block; margin: .22rem 0; font-size: clamp(1.7rem, 3vw, 2.45rem); letter-spacing: -.06em; line-height: 1; }
.goalModeHero small { color: var(--muted); font-weight: 750; }
.goalModeCardsV38 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; }
.goalModeCard {
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: .95rem;
  background: var(--surface3);
  box-shadow: var(--shadow2);
}
.goalModeCard.active { background: linear-gradient(135deg, #0f766e, #0fba8c); color: white; }
.goalModeCard.disabled { opacity: .72; }
.goalModeCard strong { display: block; font-size: 1.02rem; }
.goalModeCard small { display: block; margin-top: .22rem; color: var(--muted); }
.goalModeCard.active small { color: rgba(255,255,255,.78); }
.goalModeHero.custom,
.goalModeCard.disabled {
  display: none !important;
}
.customGoalBudgetV107 {
  display: grid;
  gap: .9rem;
}
.customGoalBudgetV107.active {
  border-color: rgba(92, 240, 178, .36);
}
.customGoalBudgetFormV107 {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto auto;
  gap: .75rem;
  align-items: end;
}
.customGoalBudgetFormV107 label {
  display: grid;
  gap: .35rem;
}
.customGoalBudgetFormV107 label span {
  color: var(--muted);
  font-weight: 900;
  font-size: .78rem;
}
.customGoalBudgetStatsV107 {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .7rem;
}
.customGoalBudgetStatsV107 > div {
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: .85rem;
  background: var(--surface2);
}
.customGoalBudgetStatsV107 small {
  display: block;
  color: var(--muted);
  font-weight: 900;
  font-size: .76rem;
}
.customGoalBudgetStatsV107 strong {
  display: block;
  margin-top: .22rem;
}
@media (max-width: 720px) {
  .customGoalBudgetFormV107,
  .customGoalBudgetStatsV107 {
    grid-template-columns: 1fr;
  }
}
.movementGoalMatchV108 {
  display: grid;
  gap: 1rem;
  overflow: hidden;
}
.movementGoalMatchV108 .panelHead {
  align-items: stretch;
}
.movementGoalMatchV108 h2 {
  margin-top: .1rem;
}
.movementVerdictV108 {
  min-width: 17rem;
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: .85rem 1rem;
  background: var(--surface2);
}
.movementVerdictV108 strong,
.movementVerdictV108 span {
  display: block;
}
.movementVerdictV108 strong {
  font-size: 1.05rem;
  letter-spacing: -.03em;
}
.movementVerdictV108 span {
  margin-top: .22rem;
  color: var(--muted);
  font-weight: 800;
  line-height: 1.4;
}
.movementVerdictV108.ok {
  border-color: rgba(16, 185, 129, .32);
  background: rgba(236, 253, 245, .9);
}
.movementVerdictV108.warn {
  border-color: rgba(245, 158, 11, .32);
  background: rgba(255, 251, 235, .92);
}
.movementVerdictV108.bad {
  border-color: rgba(244, 63, 94, .32);
  background: rgba(255, 241, 242, .92);
}
.movementMatchSummaryV108 {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .75rem;
}
.movementMatchSummaryV108 > div,
.movementGoalRowV108 {
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--surface2);
  box-shadow: var(--shadowSoft);
}
.movementMatchSummaryV108 > div {
  padding: .85rem;
}
.movementMatchSummaryV108 small,
.movementGoalRowV108 small {
  display: block;
  color: var(--muted);
  font-weight: 950;
  font-size: .72rem;
  text-transform: none;
}
.movementMatchSummaryV108 strong,
.movementGoalRowV108 strong {
  display: block;
  margin-top: .18rem;
  font-size: 1.04rem;
}
.movementMatchSummaryV108 span,
.movementGoalRowV108 span {
  display: block;
  margin-top: .18rem;
  color: var(--muted);
  font-size: .78rem;
  font-weight: 750;
}
.movementGoalRowsV108 {
  display: grid;
  gap: .65rem;
}
.movementGoalRowV108 {
  display: grid;
  grid-template-columns: minmax(190px, 1.35fr) repeat(4, minmax(130px, 1fr));
  gap: .85rem;
  align-items: center;
  padding: .85rem 1rem;
}
.movementGoalRowV108 h3 {
  margin: 0;
  font-size: 1rem;
}
.movementGoalRowV108 em {
  display: inline-flex;
  margin-top: .45rem;
  border-radius: 999px;
  padding: .25rem .55rem;
  font-style: normal;
  font-size: .69rem;
  font-weight: 950;
  background: #ecfdf5;
  color: #047857;
}
.movementGoalRowV108.tight em {
  background: #fffbeb;
  color: #92400e;
}
.movementGoalRowV108.short em {
  background: #fff1f2;
  color: #be123c;
}
.movementGoalRowV108.doable {
  border-color: rgba(16, 185, 129, .24);
}
.movementGoalRowV108.tight {
  border-color: rgba(245, 158, 11, .26);
}
.movementGoalRowV108.short {
  border-color: rgba(244, 63, 94, .26);
}
@media (max-width: 1180px) {
  .movementMatchSummaryV108 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .movementGoalRowV108 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .movementGoalRowV108 > div:first-child {
    grid-column: 1 / -1;
  }
}
@media (max-width: 720px) {
  .movementGoalMatchV108 .panelHead,
  .movementMatchSummaryV108,
  .movementGoalRowV108 {
    grid-template-columns: 1fr;
  }
  .movementVerdictV108 {
    min-width: 0;
  }
}
.goalPlannerNoteV38 {
  color: var(--muted);
  margin: 0;
  line-height: 1.5;
}
.deadlineReserveV38 { display: grid; gap: .9rem; }
.goalAmountBadge { text-align: right; min-width: 8rem; }
.goalAmountBadge strong { display:block; font-size: 1.2rem; letter-spacing: -.04em; }
.goalAmountBadge small { color: var(--muted); font-weight: 800; }
.goalReserveSummaryV38 { display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap:.7rem; }
.goalReserveSummaryV38 > div {
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: .9rem;
  background: var(--surface2);
}
.goalReserveSummaryV38 small { display:block; color:var(--muted); font-size:.76rem; font-weight:900; }
.goalReserveSummaryV38 strong { display:block; margin-top:.25rem; font-size:1.02rem; }
.deadlineRowsV38 { display:grid; gap:.6rem; }
.deadlineRowV38 {
  display:grid;
  grid-template-columns: minmax(170px, 1.2fr) repeat(3, minmax(130px, .8fr));
  gap: 1rem;
  align-items:center;
  border:1px solid var(--line);
  border-radius:18px;
  padding:.9rem 1rem;
  background: var(--surface3);
}
.deadlineRowV38 h3 { margin:0; font-size:1.02rem; }
.deadlineRowV38 span, .deadlineRowV38 small { display:block; color:var(--muted); font-size:.72rem; font-weight:850; }
.deadlineRowV38 strong { display:block; margin-top:.22rem; }
.deadlineRowV38 em { display:inline-flex; margin-top:.35rem; border-radius:999px; padding:.22rem .5rem; font-style:normal; font-size:.68rem; font-weight:950; background:#ecfdf5; color:#047857; }
.deadlineRowV38.late em { background:#fff1f2; color:#be123c; }
.goalChartsGridV38 { display:grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap:1rem; }
.goalSplitV38, .projectionV38 { min-height: 300px; }
.splitTotalBar {
  height: 16px;
  overflow:hidden;
  border-radius:999px;
  background:#e5e7eb;
  margin:.4rem 0 .75rem;
}
.splitTotalBar span { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#4f46e5,#0ea5e9,#0fba8c); }
.reserveNotice {
  border:1px solid rgba(217,119,6,.25);
  border-radius:14px;
  background:#fffbeb;
  color:#92400e;
  padding:.75rem .9rem;
  font-weight:800;
  font-size:.85rem;
  margin-bottom:.85rem;
}
.splitRowsV38 { display:grid; gap:.55rem; }
.splitRowsV38 > div { display:grid; grid-template-columns: 140px 90px 1fr; gap:.7rem; align-items:center; }
.splitRowsV38 span { font-weight:900; }
.splitRowsV38 b { text-align:right; font-size:.88rem; }
.splitRowsV38 em { display:block; height:9px; border-radius:999px; background:#e5e7eb; overflow:hidden; }
.splitRowsV38 i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#4f46e5,#0ea5e9); }
.projectionScale { display:flex; justify-content:space-between; color:var(--muted); font-size:.72rem; font-weight:850; border-bottom:1px dashed var(--line2); padding: .2rem 0 .45rem; margin:.2rem 4rem .7rem 7.5rem; }
.projectionRowsV38 { display:grid; gap:1rem; }
.projectionRowV38 { position:relative; min-height:34px; display:grid; grid-template-columns: 7.5rem minmax(0,1fr) 6rem; gap:.6rem; align-items:center; }
.projectionRowV38::before { content:""; grid-column:2; height:1px; background: #dbe3ee; }
.projectionRowV38 strong { grid-column:1; grid-row:1; font-size:.78rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.projectionRowV38 em { grid-column:3; grid-row:1; font-style:normal; color:#047857; font-weight:900; font-size:.72rem; }
.projectionRowV38.late em { color:#be123c; }
.projectionRowV38 .targetTick, .projectionRowV38 .finishDot { position:absolute; top:50%; transform:translate(-50%,-50%); grid-column:2; }
.projectionRowV38 .targetTick { width:3px; height:26px; border-radius:4px; background:#f59e0b; left: calc(7.5rem + var(--p, 0)); }
.projectionRowV38 .finishDot { width:13px; height:13px; border-radius:999px; background:#111827; border:2px solid #fff; box-shadow:0 2px 7px rgba(15,23,42,.24); }
.projectionRowV38.ok .finishDot { background:#0f766e; }
.projectionRowV38.late .finishDot { background:#e11d48; }
.chartLegend { display:flex; flex-wrap:wrap; gap:1rem; margin-top:1rem; color:var(--muted); font-size:.75rem; font-weight:850; }
.chartLegend i { display:inline-flex; width:.65rem; height:.65rem; border-radius:999px; margin-right:.32rem; vertical-align:-1px; }
.chartLegend .target { background:#f59e0b; border-radius:3px; }
.chartLegend .finish { background:#0f766e; }
.chartLegend .bad { background:#e11d48; }
.smartActionsV38 { display:grid; gap:.8rem; }
.smartActionGridV38 { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.75rem; }
.smartActionGridV38 article { border:1px solid var(--line); border-radius:17px; padding:.9rem; background:var(--surface2); }
.smartActionGridV38 strong { display:block; font-size:1rem; }
.smartActionGridV38 p { margin:.35rem 0 .75rem; color:var(--muted); font-size:.85rem; line-height:1.45; }
.goalsBottomV38 .goalCard { background: var(--surface3); }
.goalLogicMiniV38 { margin-top: 1rem; }
.goalLogicMiniV38 .metric { min-height: 76px; box-shadow: none; }

@media (max-width: 980px) {
  .goalsHeroV38, .goalChartsGridV38, .goalsBottomV38 { grid-template-columns: 1fr; }
  .goalCapacityHeroV38, .goalModeCardsV38, .goalReserveSummaryV38, .smartActionGridV38 { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .deadlineRowV38 { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .goalCapacityHeroV38, .goalModeCardsV38, .goalReserveSummaryV38, .smartActionGridV38 { grid-template-columns: 1fr; }
  .deadlineRowV38, .splitRowsV38 > div, .projectionRowV38 { grid-template-columns: 1fr; }
  .projectionScale { margin-left: 0; margin-right: 0; }
  .projectionRowV38::before, .projectionRowV38 .targetTick, .projectionRowV38 .finishDot { display:none; }
}

/* v39 data trust layer */
.trustHero { border-color: rgba(92, 240, 178, .30); }
.trustPanel { min-height: 18rem; }
.stackedActions button { min-width: 13rem; }
button.dangerBtn {
  background: linear-gradient(135deg, #ff6b85, #ffb86b);
  color: #19070a;
  border: 1px solid rgba(255, 95, 124, .36);
  box-shadow: 0 14px 28px rgba(255, 95, 124, .18), inset 0 1px 0 rgba(255,255,255,.35);
}
button.warnBtn { border-color: rgba(255, 209, 102, .38); color: var(--warn); }
.trustRules { display: grid; gap: .72rem; }
.trustRules > div {
  display: grid;
  gap: .22rem;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.04);
  padding: .86rem .92rem;
  border-radius: 15px;
}
.trustRules strong { color: var(--text); }
.trustRules span { color: var(--muted); line-height: 1.35; }
.diffPanel .tableWrap { max-height: 32rem; }
.changedRow td { background: rgba(255, 209, 102, .045); }
.auditList { display: grid; gap: .72rem; }
.auditItem {
  display: grid;
  gap: .28rem;
  border: 1px solid var(--line);
  border-radius: 15px;
  padding: .82rem .9rem;
  background: rgba(255,255,255,.04);
}
.auditItem span { color: var(--muted); font-size: .9rem; }
.auditItem code { overflow-wrap: anywhere; color: var(--brand2); font-size: .78rem; }
.smallCode { max-height: 24rem; }


/* v40 — executive cleanup: stop the child-like dark/light clash, simplify top tabs, restore professional banking layout */
:root {
  color-scheme: light;
  --bg: #f4f7fb;
  --bg2: #edf2f7;
  --surface: #ffffff;
  --surface2: #f8fafc;
  --surface3: #ffffff;
  --glass: rgba(255,255,255,.92);
  --glass2: rgba(255,255,255,.98);
  --text: #111827;
  --soft: #334155;
  --muted: #64748b;
  --faint: #94a3b8;
  --line: #dbe4ee;
  --line2: #cbd5e1;
  --brand: #0f766e;
  --brand2: #00a884;
  --brand3: #4f46e5;
  --brand4: #0ea5e9;
  --good: #059669;
  --warn: #d97706;
  --bad: #dc2626;
  --radius: 18px;
  --radius2: 12px;
  --shadow: 0 18px 48px rgba(15,23,42,.08);
  --shadow2: 0 10px 28px rgba(15,23,42,.065);
  --shadowGlow: 0 18px 48px rgba(15,23,42,.08);
}
html { background: var(--bg); }
body {
  color: var(--text) !important;
  background:
    radial-gradient(circle at 8% -8%, rgba(14,165,233,.12), transparent 28rem),
    radial-gradient(circle at 88% 4%, rgba(0,168,132,.13), transparent 32rem),
    linear-gradient(180deg, #f7fafc 0, #eef3f8 38rem, #f6f8fb 100%) !important;
}
body::before,
body::after,
.bg { display: none !important; }

/* Header */
.topbar {
  top: 0 !important;
  max-width: none !important;
  width: 100% !important;
  min-height: 64px !important;
  margin: 0 !important;
  padding: .7rem max(1.2rem, calc((100vw - 1440px) / 2 + 1.2rem)) !important;
  border: 0 !important;
  border-bottom: 1px solid #e5edf5 !important;
  border-radius: 0 !important;
  background: rgba(255,255,255,.94) !important;
  box-shadow: 0 10px 28px rgba(15,23,42,.06) !important;
  backdrop-filter: blur(18px) saturate(140%);
}
.mark {
  width: 2.35rem !important;
  height: 2.35rem !important;
  border-radius: 12px !important;
  background: #0f766e !important;
  color: white !important;
  box-shadow: none !important;
}
.brand strong { color: #0f172a !important; font-weight: 950 !important; letter-spacing: -.04em; }
.brand small { color: #64748b !important; text-transform: none !important; letter-spacing: 0 !important; font-size: .76rem !important; }
.topRight { gap: .55rem !important; }
.email { color: #475569 !important; }
.status, .pill {
  border: 1px solid #dce7f1 !important;
  background: #ffffff !important;
  color: #475569 !important;
  box-shadow: none !important;
}
.status.good, .pill.good { background: #ecfdf5 !important; color: #047857 !important; border-color: #bbf7d0 !important; }
button, .priorityItem a, .miniButton, .periodButton {
  border-radius: 12px !important;
  box-shadow: none !important;
}
button { background: #0f172a !important; color: #ffffff !important; }
button.ghost, .topRight button.ghost {
  background: #ffffff !important;
  color: #0f172a !important;
  border: 1px solid #dbe4ee !important;
}
button.ghost:hover, .topRight button.ghost:hover { background: #f8fafc !important; }

/* Shell */
.appFrame {
  max-width: 1440px !important;
  margin: 0 auto !important;
  padding: 1rem clamp(1rem, 2vw, 1.6rem) 4rem !important;
  gap: 1rem !important;
}
.topTabs {
  position: sticky !important;
  top: 76px !important;
  z-index: 15 !important;
  display: flex !important;
  justify-content: center !important;
  gap: .35rem !important;
  padding: .42rem !important;
  border: 1px solid #dbe4ee !important;
  border-radius: 16px !important;
  background: rgba(255,255,255,.94) !important;
  box-shadow: 0 12px 28px rgba(15,23,42,.06) !important;
  backdrop-filter: blur(18px) saturate(145%);
}
.topTabs a {
  color: #475569 !important;
  padding: .68rem .92rem !important;
  border-radius: 12px !important;
  font-size: .92rem !important;
  font-weight: 900 !important;
  text-decoration: none !important;
  letter-spacing: -.02em;
}
.topTabs a:hover { background: #f1f5f9 !important; color: #0f172a !important; transform: none !important; }
.topTabs a.active {
  background: #0f172a !important;
  color: #ffffff !important;
  box-shadow: none !important;
}
.topTabs .navIcon { display: none !important; }
.v2InfoBar {
  border: 1px solid #dbe4ee !important;
  border-radius: 16px !important;
  background: rgba(255,255,255,.92) !important;
  color: #64748b !important;
  box-shadow: 0 10px 24px rgba(15,23,42,.05) !important;
}
.v2InfoBar strong, .legacyLink { color: #0f766e !important; }
.buildText { color: #94a3b8 !important; }
.message { background: #ecfdf5 !important; border-color: #bbf7d0 !important; color: #065f46 !important; box-shadow: none !important; }
.message.error { background: #fff1f2 !important; border-color: #fecdd3 !important; color: #9f1239 !important; }

/* Universal cards */
.authHero, .authCard, .panel, .metric, .goalCard, .warningBox, .empty, .sideCard, .miniCard,
.priorityStack, .periodBar, .statRibbon article, .goalModeHero, .goalModeCard, .deadlineRowV38,
.smartActionGridV38 article, .goalReserveSummaryV38 > div, .compactRows > div, .priorityItem {
  background: #ffffff !important;
  color: #111827 !important;
  border: 1px solid #dbe4ee !important;
  box-shadow: var(--shadow2) !important;
}
.authHero::before, .authCard::before, .pageHero::before, .commandHero::before, .panel::before, .metric::before, .goalCard::before, .miniCard::before, .empty::before,
.authHero::after, .authCard::after, .pageHero::after, .commandHero::after, .metric.accent::after { display: none !important; }
.panel, .metric, .goalCard, .miniCard { border-radius: 18px !important; }
.panelHead small, .metric small, .miniCard small, .compactRows span, .compactRows small,
.priorityItem small, .dataList dt, .dataList.small dt, .muted, .hint, .cleanList,
.goalModeHero small, .goalModeCard small, .deadlineRowV38 span, .deadlineRowV38 small,
.goalReserveSummaryV38 small, .trustRules span, .auditItem span, .checkCard small,
.statRibbon span, .statRibbon small { color: #64748b !important; }
.panel h2, .panel h3, .metric strong, .miniCard strong, .compactRows strong,
.priorityItem strong, .dataList dd, .goalCard h3, .goalNumbers strong,
.authHero h1, .pageHero h1, .commandHero h1, .authCard h2,
.goalModeHero strong, .goalModeCard strong, .deadlineRowV38 strong,
.goalReserveSummaryV38 strong, .trustRules strong, .empty h3 { color: #111827 !important; }

/* Dashboard */
.commandHero, .pageHero {
  min-height: 12.2rem !important;
  border: 1px solid #dbe4ee !important;
  border-radius: 24px !important;
  background:
    linear-gradient(135deg, #ffffff 0%, #f8fafc 62%, #ecfdf5 100%) !important;
  box-shadow: var(--shadow) !important;
  color: #111827 !important;
}
.commandHero h1, .pageHero h1 {
  color: #0f172a !important;
  font-size: clamp(2.25rem, 4vw, 3.8rem) !important;
  line-height: .95 !important;
  max-width: 14ch;
}
.commandHero p:not(.eyebrow), .pageHero p:not(.eyebrow) { color: #64748b !important; }
.eyebrow { color: #0f766e !important; letter-spacing: .14em !important; }
.heroStatRail {
  background: #0f172a !important;
  color: white !important;
  border: 0 !important;
  border-radius: 18px !important;
  box-shadow: 0 18px 40px rgba(15,23,42,.14) !important;
}
.heroStatRail small { color: rgba(255,255,255,.68) !important; }
.heroStatRail strong { color: #ffffff !important; }
.periodBar { display: none !important; }
.mainOverviewGrid {
  display: grid !important;
  grid-template-columns: minmax(0, 1.25fr) minmax(330px, .62fr) !important;
  gap: 1rem !important;
}
.safeHeroCard {
  min-height: 300px !important;
  padding: clamp(1.35rem, 3vw, 2rem) !important;
  border: 0 !important;
  border-radius: 24px !important;
  background:
    radial-gradient(circle at 86% 8%, rgba(255,255,255,.16), transparent 13rem),
    linear-gradient(135deg, #111827 0%, #0f2f3a 48%, #0f766e 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 26px 60px rgba(15,23,42,.16) !important;
}
.safeHeroCard h2 { color: #ffffff !important; font-size: clamp(3.2rem, 7vw, 5.8rem) !important; letter-spacing: -.08em; }
.safeHeroTop, .safeSubtitle, .safeHeroMiniStats small { color: rgba(255,255,255,.72) !important; }
.safeHeroMiniStats div {
  background: rgba(255,255,255,.12) !important;
  border: 1px solid rgba(255,255,255,.15) !important;
  box-shadow: none !important;
}
.safeHeroMiniStats strong { color: #ffffff !important; }
.miniButton, .priorityItem a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #0f172a !important;
  color: #ffffff !important;
  text-decoration: none !important;
  font-weight: 950;
}
.safeHeroCard .miniButton { background: #ffffff !important; color: #0f172a !important; }
.priorityStack { padding: 1.1rem !important; }
.priorityItem { box-shadow: none !important; background: #f8fafc !important; }
.priorityIcon { background: #e6fffa !important; color: #0f766e !important; }
.cashflowList div:not(.rowBetween) { background: transparent !important; border: 0 !important; box-shadow: none !important; }
.statRibbon { grid-template-columns: repeat(6, minmax(0,1fr)) !important; }
.statRibbon article { padding: .95rem 1rem !important; border-radius: 16px !important; box-shadow: 0 10px 22px rgba(15,23,42,.055) !important; }
.statRibbon article::before { background: #0f766e !important; }
.statRibbon article.warn::before { background: #f59e0b !important; }
.statRibbon strong { color: #0f766e !important; }
.dashboardLowerGrid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 1rem !important; }
.velocityPanel, .goalFocusPanel, .coachPanel { min-height: 18rem !important; }
.focusGoal {
  background: linear-gradient(135deg, #0f172a, #0f766e) !important;
  border: 0 !important;
  color: white !important;
  box-shadow: none !important;
}
.focusGoal strong { color: #ffffff !important; }
.focusGoal small, .focusGoal span { color: rgba(255,255,255,.74) !important; }
.oldStyleBottom { gap: 1rem !important; }

/* Tables and forms */
.tableWrap { background: #ffffff !important; border: 1px solid #dbe4ee !important; border-radius: 16px !important; box-shadow: none !important; }
table { min-width: 760px; }
th { color: #475569 !important; background: #f8fafc !important; }
td { color: #111827 !important; }
tr:hover td { background: #f8fafc !important; }
input, textarea, select {
  background: #ffffff !important;
  color: #111827 !important;
  border-color: #cbd5e1 !important;
  box-shadow: none !important;
}
input:focus, textarea:focus, select:focus { border-color: #0f766e !important; box-shadow: 0 0 0 3px rgba(15,118,110,.12) !important; }
label, label span { color: #475569 !important; }
.code, .smallCode { background: #f8fafc !important; color: #111827 !important; border-color: #dbe4ee !important; }

/* Goals v2 old planner but professional */
.goalsHeroV38 { grid-template-columns: minmax(0, 1fr) minmax(310px, .48fr) !important; }
.goalPlannerShellV38 { gap: 1rem !important; }
.goalCapacityHeroV38, .goalModeCardsV38 { gap: .85rem !important; }
.goalModeHero, .goalModeCard { background: #ffffff !important; }
.goalModeHero.active, .goalModeCard.active {
  background: linear-gradient(135deg, #111827, #0f766e) !important;
  color: white !important;
  border-color: transparent !important;
}
.goalModeHero.active strong, .goalModeHero.active span, .goalModeCard.active strong { color: #ffffff !important; }
.goalModeHero.active small, .goalModeCard.active small { color: rgba(255,255,255,.76) !important; }
.goalPlannerNoteV38 {
  color: #475569 !important;
  background: #ffffff !important;
  border: 1px solid #dbe4ee !important;
  border-radius: 16px !important;
  padding: 1rem 1.1rem !important;
  margin: 0 !important;
}
.deadlineReserveV38, .goalSplitV38, .projectionV38, .smartActionsV38 { background: #ffffff !important; }
.goalReserveSummaryV38 > div, .deadlineRowV38, .smartActionGridV38 article { background: #f8fafc !important; box-shadow: none !important; }
.deadlineRowV38 { border-radius: 16px !important; }
.deadlineRowV38 em { background: #dcfce7 !important; color: #047857 !important; }
.deadlineRowV38.late em { background: #fee2e2 !important; color: #b91c1c !important; }
.reserveNotice { background: #fff7ed !important; border-color: #fed7aa !important; color: #9a3412 !important; }
.splitTotalBar, .splitRowsV38 em, .projectionRowV38::before { background: #e5eaf1 !important; }
.projectionScale { border-color: #dbe4ee !important; color: #64748b !important; }
.goalCard { background: #ffffff !important; }
.goalsBottomV38 .goalCard { background: #ffffff !important; }
.goalLogicMiniV38 .metric { background: #f8fafc !important; }

/* Holiday and health */
.holidayTabs {
  background: #ffffff !important;
  border-color: #dbe4ee !important;
  border-radius: 16px !important;
}
.holidayTabs button { background: #f8fafc !important; color: #334155 !important; border: 1px solid #dbe4ee !important; }
.holidayTabs .active { background: #0f172a !important; color: #ffffff !important; }
.checkCard { background: #ffffff !important; border-color: #dbe4ee !important; }
.checkCard:hover { background: #f8fafc !important; }
.trustHero { background: linear-gradient(135deg,#ffffff,#ecfdf5) !important; }
.trustRules > div, .auditItem { background: #ffffff !important; border-color: #dbe4ee !important; }
button.dangerBtn { background: #dc2626 !important; color: #ffffff !important; border-color: #dc2626 !important; }
button.warnBtn { color: #92400e !important; background: #fffbeb !important; border-color: #fed7aa !important; }

/* Make the page breathe, but do not look empty */
.content { gap: 1rem !important; }
.twoCol { gap: 1rem !important; }
.panel { padding: 1.1rem !important; }
.panelHead { margin-bottom: .9rem !important; }
.panel h2 { font-size: 1.22rem !important; }
.compactRows { gap: .55rem !important; }
.compactRows > div { border-radius: 12px !important; padding: .75rem .85rem !important; background: #f8fafc !important; box-shadow: none !important; }

/* Responsive */
@media (max-width: 1180px) {
  .mainOverviewGrid, .dashboardLowerGrid, .goalsHeroV38, .goalChartsGridV38, .goalsBottomV38 { grid-template-columns: 1fr !important; }
  .statRibbon { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  .goalCapacityHeroV38, .goalModeCardsV38 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 760px) {
  .topbar { align-items: flex-start !important; flex-direction: column !important; }
  .topTabs { top: 118px !important; justify-content: flex-start !important; }
  .statRibbon, .goalCapacityHeroV38, .goalModeCardsV38, .goalReserveSummaryV38, .smartActionGridV38 { grid-template-columns: 1fr !important; }
  .safeHeroCard h2 { font-size: 3.2rem !important; }
  .commandHero h1, .pageHero h1 { font-size: 2.35rem !important; }
  .appFrame { padding: .8rem .8rem 2rem !important; }
}

/* v41 functional stabilisation */
.toolbarRow {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1rem;
  margin: 0 0 1rem;
  flex-wrap: wrap;
}
.searchBox {
  display: grid;
  gap: .35rem;
  flex: 1 1 320px;
  max-width: 520px;
}
.searchBox span {
  color: var(--muted);
  font-weight: 850;
  font-size: .8rem;
}
.searchBox input {
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: .85rem 1rem;
  font-weight: 750;
  background: #fff;
  color: var(--text);
}
.segmentedControl {
  display: flex;
  gap: .55rem;
  flex-wrap: wrap;
  margin: .35rem 0 1.1rem;
}
.segmentedControl button {
  border: 1px solid var(--line);
  background: #fff;
  color: var(--muted);
  border-radius: 999px;
  padding: .62rem .95rem;
  font-weight: 900;
  cursor: pointer;
}
.segmentedControl button.active {
  background: var(--ink);
  color: #fff;
  border-color: var(--ink);
}
.billCard button { margin-top: .85rem; width: 100%; }
.goalModeHero,
.goalModeCard {
  appearance: none;
  text-align: left;
  font: inherit;
  cursor: pointer;
}
.goalModeHero:focus-visible,
.goalModeCard:focus-visible,
.segmentedControl button:focus-visible,
.toolbarRow button:focus-visible,
.billCard button:focus-visible {
  outline: 3px solid rgba(15, 118, 110, .25);
  outline-offset: 2px;
}
.formActions.full {
  grid-column: 1 / -1;
}
.checkCard input,
.billCard button,
.holidayTabs button,
[data-v2-goal-mode] { cursor: pointer; }
@media (max-width: 760px) {
  .toolbarRow { align-items: stretch; }
  .toolbarRow > * { width: 100%; max-width: none; }
}

/* v42 — Settings/Starling control rebuild */
.settingsHero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: center;
  padding: clamp(1.35rem, 2.6vw, 2rem);
  border: 1px solid #d9e3ee;
  border-radius: 24px;
  background:
    radial-gradient(circle at 88% 12%, rgba(20, 184, 166, .14), transparent 24rem),
    linear-gradient(135deg, #ffffff 0%, #f7fbff 52%, #ecfdf8 100%);
  box-shadow: 0 22px 60px rgba(15, 23, 42, .08);
}
.settingsHero h1 {
  margin: .2rem 0 .45rem;
  color: #0f172a !important;
  font-size: clamp(2.45rem, 4.8vw, 4.25rem);
  line-height: .9;
  letter-spacing: -.075em;
}
.settingsHero p:not(.eyebrow) { margin: 0; color: #64748b; max-width: 68rem; }
.settingsHeroStack { display: flex; align-items: center; justify-content: flex-end; gap: .6rem; flex-wrap: wrap; }
.settingsSummaryGrid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}
.settingsSummaryGrid .metric { min-width: 0; }
.settingsSummaryGrid .metric strong { overflow-wrap: anywhere; word-break: break-word; }
.settingsControlGrid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(360px, .85fr);
  gap: 1rem;
  align-items: stretch;
}
.controlCard {
  border: 1px solid #d9e3ee;
  border-radius: 24px;
  background: #ffffff;
  padding: 1.12rem;
  box-shadow: 0 18px 46px rgba(15, 23, 42, .075);
}
.controlHeader {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: flex-start;
  margin-bottom: 1rem;
}
.controlHeader h2 {
  margin: .15rem 0 .35rem;
  color: #0f172a;
  font-size: 1.55rem;
  letter-spacing: -.05em;
}
.controlHeader p:not(.eyebrow) { margin: 0; color: #64748b; line-height: 1.45; }
.starlingControlCard {
  background:
    radial-gradient(circle at 100% 0%, rgba(20, 184, 166, .14), transparent 18rem),
    #ffffff;
}
.settingsForm { display: grid; gap: 1rem; }
.settingsForm .full { grid-column: 1 / -1; }
.settingsInline {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .85rem;
}
.toggleGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
}
.toggleCard {
  display: flex;
  gap: .8rem;
  align-items: flex-start;
  padding: .85rem;
  border: 1px solid #d9e3ee;
  border-radius: 18px;
  background: #f8fafc;
  cursor: pointer;
  transition: border-color .16s ease, background .16s ease, transform .16s ease;
}
.toggleCard:hover { border-color: rgba(20, 184, 166, .55); background: #f0fdfa; transform: translateY(-1px); }
.toggleCard input { width: auto; margin-top: .22rem; accent-color: #0f766e; }
.toggleCard strong { display: block; color: #0f172a; font-size: .96rem; }
.toggleCard small { display: block; color: #64748b; margin-top: .12rem; line-height: 1.35; }
.settingsActions { display: flex; gap: .75rem; flex-wrap: wrap; align-items: center; }
.settingsPanel .tableWrap td:first-child { font-weight: 850; color: #0f172a; }
.syncFlow {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  align-items: center;
  padding: .85rem;
  border: 1px solid #d9e3ee;
  border-radius: 18px;
  background: #f8fafc;
  color: #475569;
  font-weight: 800;
}
.syncFlow span { background: #ffffff; border: 1px solid #d9e3ee; border-radius: 999px; padding: .45rem .7rem; color: #0f172a; }
.syncFlow i { color: #0f766e; font-style: normal; }
@media (max-width: 980px) {
  .settingsHero, .settingsControlGrid { grid-template-columns: 1fr; }
  .settingsSummaryGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .settingsSummaryGrid, .settingsInline, .toggleGrid { grid-template-columns: 1fr; }
  .settingsHero h1 { font-size: 2.4rem; }
}

/* v43 — Starling nav, working themes and activity actions */
.activityTable .txRow.income td { background: rgba(16, 185, 129, 0.055); }
.activityTable .txRow.expense td { background: rgba(244, 63, 94, 0.035); }
.activityTable .txRow.transfer td { background: rgba(59, 130, 246, 0.04); }
.activityTable .txKind { display:block; margin-top:.18rem; color: var(--muted); font-size:.72rem; text-transform:uppercase; letter-spacing:.08em; font-weight:850; }
.categoryPill { display:inline-flex; align-items:center; border-radius:999px; padding:.22rem .52rem; font-size:.82rem; font-weight:850; background:#eef2f7; color:#344256; border:1px solid rgba(100,116,139,.14); }
.right.in { color:#047857; font-weight:950; }
.right.out { color:#be123c; font-weight:950; }
.right.transfer { color:#2563eb; font-weight:950; }
.txActions { white-space:nowrap; min-width: 9.8rem; }
.txActions .miniButton { padding:.45rem .62rem; border-radius:10px; font-size:.78rem; margin-left:.28rem; }
.miniButton.danger { color:#9f1239; border-color:#fecdd3; background:#fff1f2; }
.miniButton.danger:hover { background:#ffe4e6; }

/* Theme engine. Clean light is default; banking restores a controlled dark mode without breaking layout. */
html[data-theme="banking"] {
  color-scheme: dark;
  --bg:#050914; --bg2:#08111f; --surface:#0d1728; --surface2:#101c30; --surface3:#14213a;
  --text:#f4f8ff; --soft:#d9e5f7; --muted:#9badc9; --faint:#71819a;
  --line:rgba(152,174,207,.20); --line2:rgba(152,174,207,.34);
  --brand:#6d8dff; --brand2:#37e6c0; --brand3:#a96dff; --brand4:#3ab7ff;
  --good:#5cf0b2; --warn:#ffd166; --bad:#ff6b86;
  --shadow:0 24px 70px rgba(0,0,0,.34); --shadow2:0 14px 34px rgba(0,0,0,.24);
}
body[data-theme="banking"] {
  background:
    radial-gradient(circle at 10% -10%, rgba(109,141,255,.34), transparent 30rem),
    radial-gradient(circle at 90% 0%, rgba(55,230,192,.22), transparent 34rem),
    linear-gradient(180deg,#07111f 0%,#050914 100%);
  color: var(--text);
}
body[data-theme="banking"] .topbar,
body[data-theme="banking"] .topTabs,
body[data-theme="banking"] .v2InfoBar,
body[data-theme="banking"] .panel,
body[data-theme="banking"] .metric,
body[data-theme="banking"] .goalCard,
body[data-theme="banking"] .controlCard,
body[data-theme="banking"] .settingsHero,
body[data-theme="banking"] .pageHero,
body[data-theme="banking"] .authCard,
body[data-theme="banking"] .miniCard {
  background: linear-gradient(180deg, rgba(16,28,50,.92), rgba(8,15,28,.94));
  color: var(--text);
  border-color: var(--line);
}
body[data-theme="banking"] .topTabs a { color: var(--muted); }
body[data-theme="banking"] .topTabs a:hover { background: rgba(255,255,255,.07); color: var(--text); }
body[data-theme="banking"] .topTabs a.active { background: linear-gradient(135deg,var(--brand),var(--brand2)); color:#06111c; }
body[data-theme="banking"] .topbar { background: rgba(5,9,20,.88); }
body[data-theme="banking"] .brand strong,
body[data-theme="banking"] .panel h2,
body[data-theme="banking"] .panel h3,
body[data-theme="banking"] .metric strong,
body[data-theme="banking"] .pageHero h1,
body[data-theme="banking"] .settingsHero h1,
body[data-theme="banking"] .settingsHero h2,
body[data-theme="banking"] .controlCard h2,
body[data-theme="banking"] .v2InfoBar strong { color: var(--text); }
body[data-theme="banking"] .panelHead small,
body[data-theme="banking"] .metric small,
body[data-theme="banking"] label,
body[data-theme="banking"] label span,
body[data-theme="banking"] .muted,
body[data-theme="banking"] .email,
body[data-theme="banking"] .buildText { color: var(--muted); }
body[data-theme="banking"] input,
body[data-theme="banking"] textarea,
body[data-theme="banking"] select { background:#07111f; color:var(--text); border-color:var(--line); }
body[data-theme="banking"] table th { color: var(--muted); background: rgba(255,255,255,.04); }
body[data-theme="banking"] table td { color: var(--soft); border-color: var(--line); }
body[data-theme="banking"] .activityTable .txRow.income td { background: rgba(92,240,178,.06); }
body[data-theme="banking"] .activityTable .txRow.expense td { background: rgba(255,95,124,.055); }
body[data-theme="banking"] .activityTable .txRow.transfer td { background: rgba(109,141,255,.07); }
body[data-theme="banking"] .categoryPill { background: rgba(255,255,255,.07); color: var(--soft); border-color: var(--line); }
body[data-theme="banking"] .right.in { color: var(--good); }
body[data-theme="banking"] .right.out { color: var(--bad); }
body[data-theme="banking"] .right.transfer { color: var(--brand); }
body[data-theme="banking"] .miniButton.danger { background: rgba(255,95,124,.11); color:#ffdbe2; border-color:rgba(255,95,124,.34); }

/* v44 functional polish */
.healthStatusGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin:18px 0}.healthWarnings{border-left:5px solid #f59e0b}.healthWarnings.ok{border-left-color:#10b981}.warningList{display:grid;gap:12px}.warningList>div{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:14px 16px;border:1px solid var(--line);border-radius:16px;background:#fff7ed}.warningList strong{color:#7c2d12}.warningList span{color:#6b7280;text-align:right}.billDateGroup{margin-top:18px}.dateGroupHead{display:flex;justify-content:space-between;align-items:center;margin:0 0 10px;padding:8px 4px;color:#64748b}.dateGroupHead strong{color:#0f172a;font-size:1.05rem}.pillRow{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}.billCard.incomeCard{border-left:5px solid #10b981}.billCard.expenseCard{border-left:5px solid #ef4444}.compactActions{gap:8px;flex-wrap:wrap}.dangerSmall{color:#b91c1c!important;border-color:#fecaca!important;background:#fff5f5!important}.goalManagerV44{margin-top:20px}.goalManagerList{display:grid;gap:10px}.goalManagerRow{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px 16px;border:1px solid var(--line);border-radius:16px;background:var(--soft)}.goalManagerRow strong{display:block}.goalManagerRow span{color:#64748b;font-size:.92rem}.goalEditActions{margin-top:14px}.starlingSpacesPanel{margin:18px 0}.spaceRows{display:grid;gap:12px}.spaceLinkCard{display:grid;grid-template-columns:minmax(220px,1fr) minmax(180px,.6fr) auto;gap:14px;align-items:center;padding:14px 16px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(135deg,#ffffff,#f8fafc)}.spaceLinkCard.placeholder{opacity:.78}.spaceLinkCard strong{display:block;color:#0f172a}.spaceLinkCard span,.spaceLinkCard small{display:block;color:#64748b}.spaceLinkCard b{display:block;color:#0f766e}.segmentedControl button.active{background:#111827;color:#fff;border-color:#111827}@media(max-width:1000px){.healthStatusGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.spaceLinkCard,.goalManagerRow{grid-template-columns:1fr;display:grid}.warningList>div{display:block}.warningList span{text-align:left;margin-top:4px;display:block}}@media(max-width:640px){.healthStatusGrid{grid-template-columns:1fr}}
body[data-theme="banking"] .billCard.incomeCard{border-left-color:#34d399}body[data-theme="banking"] .billCard.expenseCard{border-left-color:#fb7185}body[data-theme="banking"] .spaceLinkCard,body[data-theme="banking"] .goalManagerRow{background:rgba(15,23,42,.76);border-color:rgba(148,163,184,.2)}body[data-theme="banking"] .spaceLinkCard strong,body[data-theme="banking"] .goalManagerRow strong{color:#f8fafc}

/* v45 — brighter activity, compact bills, modal editors, fixed goal manager */
.activityTable {
  border-collapse: separate !important;
  border-spacing: 0 8px !important;
}
.activityTable thead th {
  background: transparent !important;
  border-bottom: 0 !important;
}
.activityTable tbody tr.txRow td {
  border-top: 1px solid transparent !important;
  border-bottom: 1px solid transparent !important;
  padding-top: .78rem !important;
  padding-bottom: .78rem !important;
}
.activityTable tbody tr.txRow td:first-child {
  border-radius: 14px 0 0 14px !important;
  border-left: 6px solid transparent !important;
}
.activityTable tbody tr.txRow td:last-child {
  border-radius: 0 14px 14px 0 !important;
}
.activityTable .txRow.income td {
  background: linear-gradient(90deg, rgba(16,185,129,.18), rgba(16,185,129,.07)) !important;
  border-color: rgba(16,185,129,.26) !important;
}
.activityTable .txRow.income td:first-child { border-left-color:#10b981 !important; }
.activityTable .txRow.expense td {
  background: linear-gradient(90deg, rgba(244,63,94,.17), rgba(244,63,94,.065)) !important;
  border-color: rgba(244,63,94,.23) !important;
}
.activityTable .txRow.expense td:first-child { border-left-color:#f43f5e !important; }
.activityTable .txRow.transfer td {
  background: linear-gradient(90deg, rgba(59,130,246,.17), rgba(59,130,246,.065)) !important;
  border-color: rgba(59,130,246,.23) !important;
}
.activityTable .txRow.transfer td:first-child { border-left-color:#3b82f6 !important; }
.activityTable .txKind {
  display:inline-flex !important;
  margin-top:.35rem !important;
  padding:.16rem .45rem !important;
  border-radius:999px !important;
  font-size:.66rem !important;
  letter-spacing:.1em !important;
}
.txRow.income .txKind { color:#065f46 !important; background:#d1fae5 !important; }
.txRow.expense .txKind { color:#9f1239 !important; background:#ffe4e6 !important; }
.txRow.transfer .txKind { color:#1d4ed8 !important; background:#dbeafe !important; }
.right.in { color:#059669 !important; font-weight:1000 !important; }
.right.out { color:#e11d48 !important; font-weight:1000 !important; }
.right.transfer { color:#2563eb !important; font-weight:1000 !important; }
.txActions .miniButton {
  background:#0f172a !important;
  color:#fff !important;
  border:1px solid #0f172a !important;
  box-shadow:none !important;
}
.txActions .miniButton.danger {
  background:#fff1f2 !important;
  color:#be123c !important;
  border-color:#fecdd3 !important;
}
.categoryPill { font-weight:950 !important; }

.billDateGroup { margin-top: 1rem !important; }
.billsGrid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: .55rem !important;
}
.billCard {
  display: grid !important;
  grid-template-columns: minmax(220px, 1fr) minmax(260px, 1.1fr) auto !important;
  align-items: center !important;
  gap: .85rem !important;
  padding: .8rem .95rem !important;
  border-radius: 18px !important;
  min-height: auto !important;
  background: #ffffff !important;
  box-shadow: 0 10px 28px rgba(15,23,42,.05) !important;
}
.billCard.incomeCard { background: linear-gradient(90deg,#ecfdf5,#ffffff) !important; border-left:6px solid #10b981 !important; }
.billCard.expenseCard { background: linear-gradient(90deg,#fff1f2,#ffffff) !important; border-left:6px solid #f43f5e !important; }
.billCard .dataList {
  display: grid !important;
  grid-template-columns: repeat(3, max-content minmax(70px, 1fr)) !important;
  gap: .15rem .6rem !important;
  margin: 0 !important;
  align-items: baseline !important;
}
.billCard .dataList dt { color:#64748b !important; font-size:.72rem !important; text-transform:uppercase !important; letter-spacing:.08em !important; }
.billCard .dataList dd { color:#0f172a !important; font-weight:950 !important; margin:0 !important; }
.billCard .buttonRow.compactActions {
  display:flex !important;
  gap:.45rem !important;
  justify-content:flex-end !important;
  flex-wrap:nowrap !important;
}
.billCard button {
  width:auto !important;
  margin-top:0 !important;
  padding:.55rem .75rem !important;
  border-radius:12px !important;
  white-space:nowrap !important;
}
.dateGroupHead {
  border-bottom:1px solid #e2e8f0 !important;
  padding-bottom:.55rem !important;
  margin-bottom:.6rem !important;
}

.goalManagerRow {
  background: linear-gradient(135deg,#ffffff,#f8fafc) !important;
  border: 1px solid #dbe4ee !important;
  box-shadow: 0 10px 30px rgba(15,23,42,.055) !important;
  color:#0f172a !important;
}
.goalManagerRow strong { color:#0f172a !important; }
.goalManagerRow span { color:#64748b !important; }
.goalManagerRow::before {
  content:"";
  width:5px;
  align-self:stretch;
  border-radius:999px;
  background:linear-gradient(180deg,#14b8a6,#6366f1);
}
.goalManagerRow { display:grid !important; grid-template-columns: 6px minmax(0,1fr) auto !important; }
.goalManagerRow > div:first-child { min-width:0; }
.goalEditActions { display:flex !important; gap:.55rem !important; justify-content:flex-end !important; margin-top:0 !important; }
.goalEditActions button { padding:.65rem .9rem !important; border-radius:13px !important; }

.editorOverlay {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: center;
  padding: 1.2rem;
  background: rgba(15,23,42,.48);
  backdrop-filter: blur(12px);
}
.editorModal {
  width: min(760px, 100%);
  max-height: min(88vh, 860px);
  overflow: auto;
  border: 1px solid #cbd5e1;
  border-radius: 28px;
  background: #ffffff;
  color: #0f172a;
  box-shadow: 0 35px 120px rgba(15,23,42,.35);
}
.editorModalHead {
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:1rem;
  padding:1.3rem 1.35rem 1rem;
  border-bottom:1px solid #e2e8f0;
  background:linear-gradient(135deg,#f8fafc,#ecfdf5);
}
.editorModalHead h2 { margin:.1rem 0 .2rem; font-size:1.65rem; letter-spacing:-.05em; color:#0f172a; }
.editorModalHead small { color:#64748b; font-weight:800; }
.iconOnly { width:2.4rem; height:2.4rem; padding:0 !important; display:grid; place-items:center; font-size:1.4rem; }
.editorForm { padding:1.2rem 1.35rem 1.35rem; }
.editorFieldGrid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.9rem; }
.editorField.full { grid-column:1 / -1; }
.editorField input,
.editorField select,
.editorField textarea {
  background:#f8fafc !important;
  color:#0f172a !important;
  border-color:#cbd5e1 !important;
}
.editorField small { display:block; margin-top:.32rem; color:#64748b; font-weight:700; }
.editorActions {
  display:grid;
  grid-template-columns:auto 1fr auto auto;
  gap:.65rem;
  align-items:center;
  margin-top:1.15rem;
  padding-top:1rem;
  border-top:1px solid #e2e8f0;
}
.editorActions button { box-shadow:none !important; }
.editorActions .dangerBtn { background:#fff1f2 !important; color:#be123c !important; border:1px solid #fecdd3 !important; }
.editorActions .ghost { background:#f8fafc !important; color:#0f172a !important; border:1px solid #cbd5e1 !important; }

body[data-theme="banking"] .editorModal { background:#0f172a; color:#f8fafc; border-color:rgba(148,163,184,.28); }
body[data-theme="banking"] .editorModalHead { background:linear-gradient(135deg,#111827,#0f766e); border-bottom-color:rgba(148,163,184,.25); }
body[data-theme="banking"] .editorModalHead h2 { color:#f8fafc; }
body[data-theme="banking"] .editorModalHead small { color:#cbd5e1; }
body[data-theme="banking"] .editorField input,
body[data-theme="banking"] .editorField select,
body[data-theme="banking"] .editorField textarea { background:#07111f !important; color:#f8fafc !important; border-color:rgba(148,163,184,.25) !important; }
body[data-theme="banking"] .editorActions { border-top-color:rgba(148,163,184,.25); }
body[data-theme="banking"] .activityTable .txRow.income td { background:rgba(16,185,129,.14) !important; }
body[data-theme="banking"] .activityTable .txRow.expense td { background:rgba(244,63,94,.13) !important; }
body[data-theme="banking"] .activityTable .txRow.transfer td { background:rgba(59,130,246,.13) !important; }
body[data-theme="banking"] .billCard.incomeCard { background:linear-gradient(90deg,rgba(16,185,129,.18),rgba(15,23,42,.72)) !important; }
body[data-theme="banking"] .billCard.expenseCard { background:linear-gradient(90deg,rgba(244,63,94,.17),rgba(15,23,42,.72)) !important; }
body[data-theme="banking"] .billCard .dataList dd { color:#f8fafc !important; }
body[data-theme="banking"] .goalManagerRow { background:rgba(15,23,42,.76) !important; color:#f8fafc !important; }
body[data-theme="banking"] .goalManagerRow strong { color:#f8fafc !important; }
body[data-theme="banking"] .goalManagerRow span { color:#cbd5e1 !important; }

@media (max-width: 900px) {
  .billCard { grid-template-columns:1fr !important; }
  .billCard .dataList { grid-template-columns:max-content 1fr !important; }
  .billCard .buttonRow.compactActions { justify-content:stretch !important; flex-wrap:wrap !important; }
  .billCard button { flex:1 1 140px !important; }
  .goalManagerRow { grid-template-columns:1fr !important; }
  .goalManagerRow::before { display:none; }
  .editorFieldGrid { grid-template-columns:1fr; }
  .editorActions { grid-template-columns:1fr; }
}

/* v46 — activity rows use one solid colour bar instead of segmented cells */
.activityTable {
  border-collapse: separate !important;
  border-spacing: 0 10px !important;
}
.activityTable tbody tr.txRow td {
  background-clip: padding-box !important;
  border-top-width: 1px !important;
  border-bottom-width: 1px !important;
  border-left: 0 !important;
  border-right: 0 !important;
}
.activityTable tbody tr.txRow td + td {
  border-left: 0 !important;
}
.activityTable tbody tr.txRow td:first-child {
  border-left: 6px solid transparent !important;
  border-radius: 14px 0 0 14px !important;
}
.activityTable tbody tr.txRow td:last-child {
  border-right: 1px solid transparent !important;
  border-radius: 0 14px 14px 0 !important;
}
.activityTable .txRow.income td {
  background: #dffaf0 !important;
  border-top-color: #9fe7c7 !important;
  border-bottom-color: #9fe7c7 !important;
}
.activityTable .txRow.income td:first-child {
  border-left-color: #10b981 !important;
}
.activityTable .txRow.income td:last-child {
  border-right-color: #9fe7c7 !important;
}
.activityTable .txRow.expense td {
  background: #ffe8ed !important;
  border-top-color: #f8b3c0 !important;
  border-bottom-color: #f8b3c0 !important;
}
.activityTable .txRow.expense td:first-child {
  border-left-color: #f43f5e !important;
}
.activityTable .txRow.expense td:last-child {
  border-right-color: #f8b3c0 !important;
}
.activityTable .txRow.transfer td {
  background: #eaf2ff !important;
  border-top-color: #b7cefb !important;
  border-bottom-color: #b7cefb !important;
}
.activityTable .txRow.transfer td:first-child {
  border-left-color: #3b82f6 !important;
}
.activityTable .txRow.transfer td:last-child {
  border-right-color: #b7cefb !important;
}


/* v47 — Holiday document upload vault */
.uploadDrop {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: 1rem;
  border: 1px dashed #a5b4fc;
  border-radius: 18px;
  background: linear-gradient(135deg, #eef2ff, #ecfdf5);
  margin-bottom: 1rem;
}
.uploadDrop strong { color: #0f172a; font-size: 1.05rem; }
.uploadDrop p { margin: .25rem 0; color: #475569; }
.uploadDrop small { color: #64748b; }
.uploadButton {
  width: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  padding: .85rem 1.05rem;
  background: #0f172a;
  color: #ffffff !important;
  font-weight: 950;
  white-space: nowrap;
  cursor: pointer;
  box-shadow: 0 12px 24px rgba(15,23,42,.14);
}
.uploadButton input { display: none; }
.docCheckGrid .docCard {
  display: grid;
  gap: .85rem;
  align-content: start;
}
.docCheckLine {
  display: flex;
  align-items: flex-start;
  gap: .72rem;
  width: 100%;
}
.docCheckLine input {
  width: auto;
  margin-top: .2rem;
}
.docAttachRow {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .55rem;
  align-items: center;
}
.docAttachRow select {
  min-width: 0;
  padding: .68rem .75rem;
  border-radius: 12px;
}
.panelSubhead {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1rem;
  margin: 1.2rem 0 .7rem;
}
.panelSubhead h3 { margin: 0; }
.panelSubhead small { color: #64748b; font-weight: 850; }
.docVaultList {
  display: grid;
  gap: .7rem;
}
.docVaultRow {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: .9rem 1rem;
  border: 1px solid #dbe4ef;
  border-radius: 16px;
  background: #ffffff;
}
.docVaultRow strong { display: block; color: #0f172a; }
.docVaultRow small { display: block; color: #64748b; margin-top: .18rem; }
.rowActions {
  display: inline-flex;
  gap: .45rem;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.empty.small {
  padding: 1rem;
  border-radius: 16px;
  box-shadow: none;
}
body[data-theme="banking"] .uploadDrop {
  background: linear-gradient(135deg, rgba(109,141,255,.15), rgba(55,230,192,.10));
  border-color: rgba(148,163,184,.28);
}
body[data-theme="banking"] .uploadDrop strong,
body[data-theme="banking"] .docVaultRow strong,
body[data-theme="banking"] .panelSubhead h3 { color: #f8fafc; }
body[data-theme="banking"] .uploadDrop p,
body[data-theme="banking"] .uploadDrop small,
body[data-theme="banking"] .docVaultRow small,
body[data-theme="banking"] .panelSubhead small { color: #cbd5e1; }
body[data-theme="banking"] .uploadButton {
  background: linear-gradient(135deg, var(--brand2), var(--brand4));
  color: #06111c !important;
}
body[data-theme="banking"] .docVaultRow {
  background: rgba(15,23,42,.76);
  border-color: rgba(148,163,184,.22);
}
@media (max-width: 720px) {
  .uploadDrop,
  .docVaultRow {
    align-items: stretch;
    flex-direction: column;
  }
  .uploadButton,
  .rowActions .miniButton {
    width: 100%;
  }
  .docAttachRow {
    grid-template-columns: 1fr;
  }
}

/* v48 — reserve toggle, cleaner projected finish chart and health page */
.reserveActionCard {
  border: 1px solid #dbe4ef !important;
  transition: border-color .16s ease, background .16s ease, transform .16s ease;
}
.reserveActionCard.active {
  background: linear-gradient(135deg, #ecfdf5, #e0f2fe) !important;
  border-color: #5eead4 !important;
}
.reserveActionCard.active button {
  background: #0f766e !important;
  color: #ffffff !important;
  border-color: #0f766e !important;
}
.projectionV48 {
  overflow: hidden;
}
.projectionScaleV48 {
  display: flex;
  justify-content: space-between;
  margin: .35rem 0 1rem;
  padding: 0 8.4rem 0 9.8rem;
  color: #64748b;
  font-size: .78rem;
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.projectionRowsV48 {
  display: grid;
  gap: .9rem;
}
.projectionRowV48 {
  display: grid;
  grid-template-columns: 9.2rem minmax(0, 1fr) 7.8rem;
  gap: 1rem;
  align-items: center;
  padding: .7rem .8rem;
  border: 1px solid #dbe4ef;
  border-radius: 16px;
  background: #f8fafc;
}
.projectionName strong,
.projectionDates strong {
  display: block;
  color: #0f172a;
  font-size: .92rem;
  line-height: 1.1;
}
.projectionName small,
.projectionDates span {
  display: block;
  margin-top: .2rem;
  color: #64748b;
  font-size: .74rem;
  font-weight: 850;
}
.projectionRowV48.ok .projectionDates span { color: #047857; }
.projectionRowV48.late .projectionDates span { color: #be123c; }
.projectionLane {
  position: relative;
  height: 22px;
  border-radius: 999px;
  background: linear-gradient(90deg, #e2e8f0, #f1f5f9);
  box-shadow: inset 0 0 0 1px rgba(148, 163, 184, .22);
}
.projectionLane .targetTick,
.projectionLane .finishDot {
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
}
.projectionLane .targetTick {
  width: 4px;
  height: 32px;
  border-radius: 999px;
  background: #f59e0b;
  box-shadow: 0 0 0 3px rgba(245, 158, 11, .14);
}
.projectionLane .finishDot {
  width: 18px;
  height: 18px;
  border-radius: 999px;
  background: #0f766e;
  border: 3px solid #ffffff;
  box-shadow: 0 8px 18px rgba(15, 23, 42, .18);
}
.projectionRowV48.late .finishDot { background: #e11d48; }
.healthHeroV48 {
  display: flex;
  justify-content: space-between;
  gap: 1.5rem;
  align-items: center;
  padding: clamp(1.6rem, 4vw, 3rem);
  border: 1px solid #dbe4ef;
  border-radius: 28px;
  background: linear-gradient(135deg, #ffffff 0%, #ecfdf5 100%);
  box-shadow: 0 18px 50px rgba(15, 23, 42, .08);
  margin-bottom: 1.3rem;
}
.healthHeroV48 h1 {
  margin: .2rem 0 .5rem;
  font-size: clamp(2.4rem, 5vw, 4.6rem);
  line-height: .92;
  letter-spacing: -.07em;
  color: #0f172a;
}
.healthHeroV48 p { color: #64748b; margin: 0; max-width: 60rem; }
.healthScoreRing {
  flex: 0 0 auto;
  width: 9.2rem;
  height: 9.2rem;
  border-radius: 999px;
  display: grid;
  place-items: center;
  align-content: center;
  border: 10px solid #d1fae5;
  background: #ffffff;
  box-shadow: 0 18px 42px rgba(15, 23, 42, .10);
}
.healthScoreRing.warn { border-color: #fed7aa; }
.healthScoreRing strong { font-size: 2.35rem; line-height: .9; color: #0f172a; }
.healthScoreRing span { font-weight: 900; color: #64748b; }
.healthScoreRing small { color: #0f766e; font-weight: 950; text-transform: uppercase; letter-spacing: .06em; font-size: .68rem; }
.healthScoreRing.warn small { color: #c2410c; }
.healthSnapshotStripV48 {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
  margin-bottom: 1.1rem;
}
.healthSnapshotStripV48 article,
.healthCheckListV48 > div,
.healthWarningsV48 > div,
.trustRulesV48 > div {
  border: 1px solid #dbe4ef;
  border-radius: 18px;
  background: #ffffff;
  padding: 1rem;
  box-shadow: 0 12px 28px rgba(15, 23, 42, .05);
}
.healthSnapshotStripV48 small,
.healthSnapshotStripV48 span { display: block; color: #64748b; font-weight: 850; }
.healthSnapshotStripV48 strong { display: block; margin: .2rem 0; color: #0f172a; font-size: clamp(1.25rem, 2.4vw, 2rem); letter-spacing: -.055em; }
.healthGridV48 {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: 1rem;
  margin-bottom: 1.1rem;
}
.healthCheckListV48,
.healthWarningsV48,
.trustRulesV48 { display: grid; gap: .75rem; }
.healthCheckListV48 > div {
  display: grid;
  grid-template-columns: 2.2rem 1fr;
  gap: .8rem;
  align-items: start;
}
.healthCheckListV48 i {
  width: 2.2rem;
  height: 2.2rem;
  border-radius: 12px;
  display: grid;
  place-items: center;
  font-style: normal;
  font-weight: 1000;
}
.healthCheckListV48 .ok i { background: #d1fae5; color: #047857; }
.healthCheckListV48 .bad i { background: #ffedd5; color: #c2410c; }
.healthCheckListV48 strong,
.healthWarningsV48 strong,
.trustRulesV48 strong { display: block; color: #0f172a; }
.healthCheckListV48 small,
.healthWarningsV48 span,
.trustRulesV48 span { display: block; color: #64748b; margin-top: .18rem; line-height: 1.35; }
.healthButtonGridV48 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .7rem;
  margin-top: 1rem;
}
.healthWarningPanelV48 { border-left: 6px solid #f97316 !important; }
.healthPassPanelV48 { border-left: 6px solid #10b981 !important; }
.healthWarningsV48 > div { background: #fff7ed; border-color: #fed7aa; }
.healthWarningsV48 strong { color: #7c2d12; }
.healthMetricsV48 { margin: 1.1rem 0; }
.rawMetaPanelV48 { opacity: .92; }
body[data-theme="banking"] .projectionRowV48,
body[data-theme="banking"] .healthSnapshotStripV48 article,
body[data-theme="banking"] .healthCheckListV48 > div,
body[data-theme="banking"] .healthWarningsV48 > div,
body[data-theme="banking"] .trustRulesV48 > div {
  background: rgba(15,23,42,.76);
  border-color: rgba(148,163,184,.22);
}
body[data-theme="banking"] .healthHeroV48 { background: linear-gradient(135deg, rgba(15,23,42,.9), rgba(15,118,110,.55)); border-color: rgba(148,163,184,.22); }
body[data-theme="banking"] .healthHeroV48 h1,
body[data-theme="banking"] .healthSnapshotStripV48 strong,
body[data-theme="banking"] .healthCheckListV48 strong,
body[data-theme="banking"] .healthWarningsV48 strong,
body[data-theme="banking"] .trustRulesV48 strong,
body[data-theme="banking"] .projectionName strong,
body[data-theme="banking"] .projectionDates strong { color: #f8fafc; }
body[data-theme="banking"] .healthHeroV48 p,
body[data-theme="banking"] .healthSnapshotStripV48 small,
body[data-theme="banking"] .healthSnapshotStripV48 span,
body[data-theme="banking"] .healthCheckListV48 small,
body[data-theme="banking"] .healthWarningsV48 span,
body[data-theme="banking"] .trustRulesV48 span,
body[data-theme="banking"] .projectionName small,
body[data-theme="banking"] .projectionDates span { color: #cbd5e1; }
body[data-theme="banking"] .projectionLane { background: rgba(255,255,255,.09); }
@media (max-width: 980px) {
  .healthHeroV48 { flex-direction: column; align-items: flex-start; }
  .healthSnapshotStripV48,
  .healthGridV48 { grid-template-columns: 1fr; }
  .projectionScaleV48 { display: none; }
  .projectionRowV48 { grid-template-columns: 1fr; }
  .healthButtonGridV48 { grid-template-columns: 1fr; }
}

/* v49 — finish 2 weeks early, wider premium workspace, health polish */
.appFrame {
  max-width: min(1840px, calc(100vw - 48px)) !important;
  width: min(1840px, calc(100vw - 48px)) !important;
  padding: .85rem 0 4rem !important;
  gap: 1.15rem !important;
}
.content { gap: 1.15rem !important; }
.topTabs {
  width: 100% !important;
  justify-content: stretch !important;
  gap: .45rem !important;
  padding: .5rem !important;
}
.topTabs a {
  flex: 1 1 auto !important;
  justify-content: center !important;
  min-width: 7.5rem !important;
}
.v2InfoBar { width: 100% !important; }
.pageHero.compact,
.healthOpsHeroV49 {
  min-height: 13rem !important;
}
.pageHero h1 { max-width: none !important; }
.panel,
.metric,
.goalCard,
.miniCard {
  box-shadow: 0 18px 45px rgba(15,23,42,.07) !important;
}
.metricsGrid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}
.twoCol {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
}
.goalPlannerShellV38 { gap: 1.15rem !important; }
.goalCapacityHeroV38 {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}
.goalModeHero {
  min-height: 8.4rem !important;
  align-content: center !important;
}
.goalModeHero strong { font-size: clamp(2rem, 3vw, 3.15rem) !important; }
.goalReserveSummaryV38 {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
.deadlineRowsV38 {
  gap: .78rem !important;
}
.deadlineRowV38 {
  grid-template-columns: minmax(16rem, 1.4fr) minmax(12rem, .9fr) minmax(10rem, .8fr) minmax(12rem, .85fr) !important;
  padding: 1rem 1.05rem !important;
}
.deadlineRowV38 small + strong + small,
.deadlineRowV38 div small:last-child {
  display: block !important;
  margin-top: .18rem !important;
  color: #64748b !important;
  font-size: .76rem !important;
  font-weight: 850 !important;
}
.smartActionGridV38 {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}
.reserveToggleHead {
  display: flex;
  justify-content: space-between;
  gap: .75rem;
  align-items: center;
}
.reserveToggleHead span,
.bufferBadge {
  display: inline-flex;
  align-items: center;
  width: max-content;
  border-radius: 999px;
  padding: .32rem .62rem;
  color: #0f766e;
  background: #ccfbf1;
  border: 1px solid #99f6e4;
  font-weight: 950;
  font-size: .78rem;
}
.reserveActionCard:not(.active) .reserveToggleHead span { color:#334155; background:#e2e8f0; border-color:#cbd5e1; }
.reserveActionCard button[aria-pressed="true"] { background:#0f766e !important; color:#fff !important; }

/* v49 projected chart */
.projectionV49 { padding-bottom: 1.25rem !important; }
.projectionV49 .projectionRowsV48 { gap: .75rem !important; }
.projectionV49 .projectionRowV48 {
  grid-template-columns: minmax(16rem, 1.05fr) minmax(28rem, 2.2fr) minmax(10rem, .8fr) !important;
  background: #ffffff !important;
  border: 1px solid #dbe4ef !important;
  box-shadow: 0 10px 24px rgba(15,23,42,.045) !important;
}
.projectionV49 .projectionLane {
  height: 34px !important;
  background: linear-gradient(90deg, #f8fafc, #e2e8f0) !important;
  border: 1px solid #cbd5e1 !important;
  overflow: visible !important;
}
.projectionV49 .projectionLane .targetTick.finishByTick {
  width: 5px !important;
  height: 42px !important;
  background: #f59e0b !important;
  z-index: 2;
}
.projectionV49 .projectionLane .realTargetTick {
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 3px;
  height: 28px;
  border-radius: 999px;
  background: #a855f7;
  box-shadow: 0 0 0 3px rgba(168,85,247,.12);
  z-index: 1;
}
.projectionV49 .projectionLane .finishDot {
  width: 21px !important;
  height: 21px !important;
  z-index: 3;
}
.chartLegend i.realTarget { background:#a855f7 !important; }
.chartLegend { flex-wrap: wrap; }
.projectionName small { line-height: 1.35 !important; }

/* v49 Health command centre */
.healthOpsHeroV49 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 13rem;
  align-items: center;
  gap: 1.5rem;
  padding: clamp(1.6rem, 3vw, 3rem);
  border: 1px solid #dbe4ef;
  border-radius: 28px;
  background:
    radial-gradient(circle at 85% 15%, rgba(20,184,166,.18), transparent 22rem),
    linear-gradient(135deg, #ffffff 0%, #f0fdfa 100%);
  box-shadow: 0 22px 60px rgba(15,23,42,.08);
}
.healthOpsHeroV49 h1 {
  margin: .25rem 0 .55rem;
  color: #0f172a;
  font-size: clamp(2.4rem, 4.8vw, 5rem);
  line-height: .9;
  letter-spacing: -.075em;
}
.healthOpsHeroV49 p { margin: 0; color:#64748b; max-width: 66rem; }
.healthScoreCardV49 {
  min-height: 11rem;
  border-radius: 26px;
  display: grid;
  align-content: center;
  justify-items: center;
  background: #ffffff;
  border: 1px solid #dbe4ef;
  box-shadow: 0 18px 45px rgba(15,23,42,.08);
}
.healthScoreCardV49 span { color:#64748b; font-weight:950; }
.healthScoreCardV49 strong { color:#0f172a; font-size: 4rem; line-height:.9; letter-spacing:-.06em; }
.healthScoreCardV49 small { color:#64748b; font-weight:850; text-align:center; }
.healthScoreCardV49.good { border-color:#99f6e4; background: linear-gradient(135deg,#ffffff,#ecfdf5); }
.healthScoreCardV49.warn { border-color:#fed7aa; background: linear-gradient(135deg,#ffffff,#fff7ed); }
.healthStatusGridV49 {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}
.healthStatusCardV49 {
  padding: 1.15rem;
  border-radius: 22px;
  background: #ffffff;
  border: 1px solid #dbe4ef;
  box-shadow: 0 16px 38px rgba(15,23,42,.06);
  border-left: 6px solid #94a3b8;
}
.healthStatusCardV49.good { border-left-color:#10b981; }
.healthStatusCardV49.warn { border-left-color:#f59e0b; }
.healthStatusCardV49 small,
.healthStatusCardV49 span { display:block; color:#64748b; font-weight:850; }
.healthStatusCardV49 strong { display:block; color:#0f172a; font-size: clamp(1.55rem, 2.6vw, 2.35rem); line-height:1; letter-spacing:-.055em; margin:.18rem 0 .32rem; overflow-wrap:anywhere; }
.healthWarningStripV49,
.healthOkStripV49 {
  display:flex;
  justify-content:space-between;
  gap:1rem;
  align-items:center;
  padding: 1rem 1.1rem;
  border-radius: 20px;
  border: 1px solid;
}
.healthWarningStripV49 { background:#fff7ed; border-color:#fed7aa; color:#9a3412; }
.healthOkStripV49 { background:#ecfdf5; border-color:#bbf7d0; color:#047857; }
.healthWarningStripV49 div { display:flex; gap:.5rem; flex-wrap:wrap; justify-content:flex-end; }
.healthWarningStripV49 span { padding:.32rem .62rem; border-radius:999px; background:#ffedd5; border:1px solid #fed7aa; font-weight:900; }
.healthCommandLayoutV49 {
  display:grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(360px, .75fr);
  gap: 1rem;
}
.healthButtonGridV49 {
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap:.65rem;
}
.healthButtonGridV49 .promoteFull { grid-column: 1 / -1; }
.healthCheckListV49 { display:grid; gap:.6rem; }
.healthCheckListV49 div {
  display:flex;
  gap:.75rem;
  align-items:flex-start;
  padding:.85rem;
  border-radius:16px;
  border:1px solid #dbe4ef;
  background:#f8fafc;
}
.healthCheckListV49 i {
  display:grid;
  place-items:center;
  flex:0 0 auto;
  width:1.6rem;
  height:1.6rem;
  border-radius:999px;
  font-style:normal;
  font-weight:1000;
}
.healthCheckListV49 .ok i { background:#d1fae5; color:#047857; }
.healthCheckListV49 .bad i { background:#ffe4e6; color:#be123c; }
.healthCheckListV49 strong { display:block; color:#0f172a; }
.healthCheckListV49 small { display:block; color:#64748b; margin-top:.15rem; }
.healthInsightGridV49 {
  display:grid;
  grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr);
  gap:1rem;
}
.healthMiniStatsV49 {
  display:grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap:.7rem;
}
.healthMiniStatsV49 div {
  padding:.9rem;
  border-radius:16px;
  border:1px solid #dbe4ef;
  background:#f8fafc;
}
.healthMiniStatsV49 small { display:block; color:#64748b; font-weight:900; }
.healthMiniStatsV49 strong { display:block; color:#0f172a; font-size:1.5rem; margin-top:.18rem; }
.trustRulesV49 { display:grid; gap:.65rem; }
.trustRulesV49 div { padding:.9rem; border:1px solid #dbe4ef; border-radius:16px; background:#f8fafc; }
.trustRulesV49 strong { display:block; color:#0f172a; }
.trustRulesV49 span { color:#64748b; }
.healthBottomV49 { align-items: stretch; }
body[data-theme="banking"] .healthOpsHeroV49,
body[data-theme="banking"] .healthScoreCardV49,
body[data-theme="banking"] .healthStatusCardV49,
body[data-theme="banking"] .healthCheckListV49 div,
body[data-theme="banking"] .healthMiniStatsV49 div,
body[data-theme="banking"] .trustRulesV49 div { background:rgba(15,23,42,.76) !important; color:#f8fafc !important; border-color:rgba(148,163,184,.24) !important; }
body[data-theme="banking"] .healthOpsHeroV49 h1,
body[data-theme="banking"] .healthScoreCardV49 strong,
body[data-theme="banking"] .healthStatusCardV49 strong,
body[data-theme="banking"] .healthCheckListV49 strong,
body[data-theme="banking"] .healthMiniStatsV49 strong,
body[data-theme="banking"] .trustRulesV49 strong { color:#f8fafc !important; }
body[data-theme="banking"] .healthOpsHeroV49 p,
body[data-theme="banking"] .healthScoreCardV49 small,
body[data-theme="banking"] .healthScoreCardV49 span,
body[data-theme="banking"] .healthStatusCardV49 small,
body[data-theme="banking"] .healthStatusCardV49 span,
body[data-theme="banking"] .healthCheckListV49 small,
body[data-theme="banking"] .healthMiniStatsV49 small,
body[data-theme="banking"] .trustRulesV49 span { color:#cbd5e1 !important; }
body[data-theme="banking"] .projectionV49 .projectionRowV48 { background:rgba(15,23,42,.76) !important; border-color:rgba(148,163,184,.22) !important; }
body[data-theme="banking"] .projectionV49 .projectionLane { background:#0f172a !important; border-color:rgba(148,163,184,.28) !important; }
body[data-theme="banking"] .projectionName strong,
body[data-theme="banking"] .projectionDates strong { color:#f8fafc !important; }
body[data-theme="banking"] .projectionName small { color:#cbd5e1 !important; }

@media (max-width: 1250px) {
  .metricsGrid,
  .healthStatusGridV49,
  .goalCapacityHeroV38 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .healthCommandLayoutV49,
  .healthInsightGridV49,
  .twoCol { grid-template-columns: 1fr !important; }
  .deadlineRowV38,
  .projectionV49 .projectionRowV48 { grid-template-columns: 1fr !important; }
  .projectionScaleV48 { padding: 0 !important; }
  .smartActionGridV38 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 760px) {
  .appFrame { width: calc(100vw - 20px) !important; max-width: calc(100vw - 20px) !important; }
  .metricsGrid,
  .healthStatusGridV49,
  .healthMiniStatsV49,
  .smartActionGridV38,
  .healthButtonGridV49,
  .goalCapacityHeroV38 { grid-template-columns: 1fr !important; }
  .healthOpsHeroV49 { grid-template-columns: 1fr; }
}

/* v50 — old-style add controls, classic bill sections and motion polish */
@keyframes cbFadeUpV50 {
  from { opacity: 0; transform: translateY(14px) scale(.992); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes cbSoftPulseV50 {
  0%, 100% { box-shadow: 0 14px 34px rgba(15,23,42,.08); }
  50% { box-shadow: 0 18px 46px rgba(99,102,241,.16); }
}
.appFrame, .panel, .metric, .pageHero, .billTileV50, .activityTable tbody tr.txRow, .miniCard, .goalCard {
  animation: cbFadeUpV50 .34s ease both;
}
.panel:nth-of-type(2), .metric:nth-child(2) { animation-delay: .025s; }
.panel:nth-of-type(3), .metric:nth-child(3) { animation-delay: .05s; }
button, .topTabs a, .billTileV50, .activityTable tbody tr.txRow, .metric, .panel {
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease, opacity .18s ease;
}
.panel:hover, .metric:hover, .billTileV50:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 42px rgba(15,23,42,.10);
}
.activityTable tbody tr.txRow:hover {
  transform: translateY(-1px);
  filter: saturate(1.04);
}
.addPanelV50 {
  border-color: #c7d2fe !important;
  background: linear-gradient(135deg, #ffffff, #f7fbff) !important;
}
.quickAddGridV50,
.billAddGridV50 {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: .75rem;
  align-items: end;
  padding: .65rem;
  border: 1px solid #dbe4ef;
  border-radius: 18px;
  background: #f8fafc;
}
.quickAddGridV50 label:nth-child(1),
.billAddGridV50 label:nth-child(1) { grid-column: span 2; }
.quickAddGridV50 button,
.billAddGridV50 button { grid-column: span 1; min-height: 3.25rem; }
.quickAddGridV50 input,
.quickAddGridV50 select,
.billAddGridV50 input,
.billAddGridV50 select { background: #ffffff !important; }
.billClassicV50 .segmentedControl { margin-bottom: 1rem; }
.billBandV50 { margin-top: 1rem; }
.billBandHeadV50 {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding: .9rem 1rem;
  border-radius: 18px;
  margin-bottom: .75rem;
  border-left: 5px solid #6366f1;
  background: #eef2ff;
}
.billBandHeadV50 h3 { margin:0; color:#0f172a; font-size:1.1rem; }
.billBandHeadV50 small { display:block; margin-top:.2rem; color:#64748b; font-weight:800; }
.billBandHeadV50 strong {
  display:grid;
  place-items:center;
  min-width:2.25rem;
  height:2.25rem;
  padding:0 .65rem;
  border-radius:12px;
  background:#fff;
  color:#0f172a;
}
.billBandV50.income .billBandHeadV50 { background:#dcfce7; border-left-color:#10b981; }
.billBandV50.priority .billBandHeadV50 { background:#ffe4ec; border-left-color:#f43f5e; }
.billBandV50.nonpriority .billBandHeadV50 { background:#eef2ff; border-left-color:#4f46e5; }
.billBandV50.paid .billBandHeadV50 { background:#f1f5f9; border-left-color:#64748b; }
.billCardGridV50 {
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:.85rem;
}
.billTileV50 {
  display:grid;
  gap:.8rem;
  padding:1rem;
  border:1px solid #dbe4ef;
  border-radius:20px;
  background:#ffffff;
  min-height: 11rem;
  box-shadow: 0 12px 32px rgba(15,23,42,.065);
}
.billTileV50.priorityCard { border-top:4px solid #f43f5e; background: linear-gradient(180deg,#fff,#fff7fa); }
.billTileV50.expenseCard { border-top:4px solid #6366f1; background: linear-gradient(180deg,#fff,#f8faff); }
.billTileV50.incomeCard { border-top:4px solid #10b981; background: linear-gradient(180deg,#fff,#f2fff8); }
.billTileTopV50 {
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:.75rem;
}
.billTileTopV50 strong { color:#0f172a; font-size:1.05rem; }
.billExpenseAmount,
.billIncomeAmount {
  font-size: clamp(1.75rem, 3vw, 2.7rem);
  line-height:1;
  font-weight:1000;
  letter-spacing:-.07em;
}
.billExpenseAmount { color:#f43f5e; }
.billIncomeAmount { color:#059669; }
.billMetaV50 {
  display:flex;
  align-items:center;
  gap:.4rem;
  flex-wrap:wrap;
  color:#334155;
  font-weight:800;
}
.billMetaV50 span + span::before { content:"• "; color:#94a3b8; }
.billNotesV50 { margin:0; color:#64748b; font-weight:700; }
.logNowButtonV50 { width:100%; margin-top:auto; }
.rowActions { display:inline-flex; gap:.42rem; align-items:center; justify-content:flex-end; flex-wrap:wrap; }
.rowActions .miniButton { padding:.48rem .68rem; }
/* Stronger single-bar activity colours */
.activityTable .txRow.income td { background:#d9fbe9 !important; border-top-color:#95e8bd !important; border-bottom-color:#95e8bd !important; }
.activityTable .txRow.expense td { background:#ffe3eb !important; border-top-color:#f7a9ba !important; border-bottom-color:#f7a9ba !important; }
.activityTable .txRow.transfer td { background:#e5efff !important; border-top-color:#aac5fa !important; border-bottom-color:#aac5fa !important; }
.activityTable .txRow.income td:first-child { border-left-color:#10b981 !important; }
.activityTable .txRow.expense td:first-child { border-left-color:#f43f5e !important; }
.activityTable .txRow.transfer td:first-child { border-left-color:#3b82f6 !important; }
/* Modal feels smoother */
.editorOverlay { animation: cbFadeUpV50 .18s ease both; }
.editorModal { animation: cbFadeUpV50 .24s ease both; }
body[data-theme="banking"] .addPanelV50,
body[data-theme="banking"] .billTileV50,
body[data-theme="banking"] .billAddGridV50,
body[data-theme="banking"] .quickAddGridV50 { background: rgba(15,23,42,.78) !important; border-color: rgba(148,163,184,.24) !important; }
body[data-theme="banking"] .billBandHeadV50 { background: rgba(15,23,42,.86) !important; border-color: rgba(148,163,184,.25) !important; }
body[data-theme="banking"] .billBandHeadV50 h3,
body[data-theme="banking"] .billBandHeadV50 strong,
body[data-theme="banking"] .billTileTopV50 strong { color:#f8fafc !important; }
body[data-theme="banking"] .billBandHeadV50 small,
body[data-theme="banking"] .billMetaV50,
body[data-theme="banking"] .billNotesV50 { color:#cbd5e1 !important; }
body[data-theme="banking"] .billBandHeadV50 strong { background:rgba(255,255,255,.08); }
body[data-theme="banking"] .quickAddGridV50 input,
body[data-theme="banking"] .quickAddGridV50 select,
body[data-theme="banking"] .billAddGridV50 input,
body[data-theme="banking"] .billAddGridV50 select { background:#07111f !important; color:#f8fafc !important; }
@media (max-width: 1180px) {
  .quickAddGridV50,
  .billAddGridV50 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .quickAddGridV50 label:nth-child(1),
  .billAddGridV50 label:nth-child(1) { grid-column: span 2; }
  .billCardGridV50 { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 720px) {
  .quickAddGridV50,
  .billAddGridV50,
  .billCardGridV50 { grid-template-columns: 1fr; }
  .quickAddGridV50 label:nth-child(1),
  .billAddGridV50 label:nth-child(1) { grid-column: span 1; }
  .billTileTopV50 { flex-direction:column; }
  .rowActions, .rowActions .miniButton { width:100%; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration:.001ms !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
}


/* v51 — more life: animated background, health cards, contracts and log polish */
body {
  background:
    radial-gradient(circle at 8% 8%, rgba(88, 80, 236, 0.08), transparent 28rem),
    radial-gradient(circle at 92% 12%, rgba(16, 185, 129, 0.11), transparent 32rem),
    linear-gradient(135deg, #f4f8fb 0%, #eef5f8 48%, #f7fafc 100%) !important;
}
body::before {
  content: "";
  position: fixed;
  inset: -20%;
  pointer-events: none;
  z-index: -2;
  background:
    radial-gradient(circle at 15% 20%, rgba(91, 110, 255, .22), transparent 24rem),
    radial-gradient(circle at 82% 12%, rgba(16, 185, 129, .22), transparent 26rem),
    radial-gradient(circle at 65% 85%, rgba(168, 85, 247, .16), transparent 24rem),
    radial-gradient(circle at 22% 82%, rgba(14, 165, 233, .14), transparent 22rem);
  animation: cbAurora 24s ease-in-out infinite alternate;
}
body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    linear-gradient(110deg, transparent 0%, rgba(255,255,255,.34) 22%, transparent 45%),
    linear-gradient(rgba(15, 23, 42, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15, 23, 42, .028) 1px, transparent 1px);
  background-size: 42rem 100%, 84px 84px, 84px 84px;
  opacity: .75;
  animation: cbSheen 16s linear infinite;
}
@keyframes cbAurora {
  0% { transform: translate3d(-1rem, -1rem, 0) scale(1); filter: hue-rotate(0deg); }
  50% { transform: translate3d(1.6rem, .8rem, 0) scale(1.04); filter: hue-rotate(10deg); }
  100% { transform: translate3d(-.4rem, 1.4rem, 0) scale(1.07); filter: hue-rotate(-8deg); }
}
@keyframes cbSheen {
  from { background-position: -42rem 0, 0 0, 0 0; }
  to { background-position: 42rem 0, 84px 84px, 84px 84px; }
}
@media (prefers-reduced-motion: reduce) {
  body::before, body::after, .healthRing::after, .healthPulseCard.celebrate::after { animation: none !important; }
}
.appFrame {
  width: min(100% - 1.5rem, 1820px) !important;
  max-width: 1820px !important;
}
.content {
  animation: pageLift .35s ease both;
}
@keyframes pageLift {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}
.panel, .metric, .safeHeroCard, .priorityStack, .contractCard, .healthPulseCard {
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.panel:hover, .metric:hover, .contractCard:hover, .healthPulseCard:hover {
  transform: translateY(-2px);
  box-shadow: 0 22px 48px rgba(15,23,42,.10) !important;
  border-color: rgba(15, 186, 140, .24) !important;
}
.aliveHero {
  background:
    radial-gradient(circle at 85% 20%, rgba(16,185,129,.16), transparent 20rem),
    linear-gradient(135deg, rgba(255,255,255,.94), rgba(236,253,245,.88)) !important;
}

.overviewHealthGrid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .9rem;
  margin: 1rem 0;
}
.healthPulseCard {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.15rem 1.25rem;
  border: 1px solid #dbe4ef;
  border-radius: 24px;
  background: rgba(255,255,255,.92);
  box-shadow: 0 16px 42px rgba(15,23,42,.06);
}
.healthPulseCard small {
  display: block;
  color: #64748b;
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.healthPulseCard strong {
  display: block;
  color: #0f172a;
  font-size: clamp(2rem, 4vw, 3.1rem);
  line-height: .98;
  margin: .18rem 0;
}
.healthPulseCard span {
  color: #64748b;
  font-weight: 750;
}
.healthPulseCard.good { border-left: 7px solid #10b981; }
.healthPulseCard.warn { border-left: 7px solid #f59e0b; }
.healthPulseCard.bad { border-left: 7px solid #ef4444; }
.healthPulseCard.celebrate {
  position: relative;
  overflow: hidden;
  border-left-color: #fbbf24;
  border-color: rgba(251, 191, 36, .42);
  background:
    radial-gradient(circle at 86% 18%, rgba(251, 191, 36, .20), transparent 9rem),
    radial-gradient(circle at 12% 100%, rgba(45, 212, 191, .14), transparent 12rem),
    rgba(255,255,255,.94);
}
.healthPulseCard.celebrate::after {
  content: "🎉 ✨ 💸";
  position: absolute;
  top: .7rem;
  right: 1rem;
  font-size: 1.15rem;
  letter-spacing: .22rem;
  opacity: .88;
  pointer-events: none;
  animation: goalConfettiFloat 2.6s ease-in-out infinite;
}
.healthPulseCard.celebrate strong {
  background: linear-gradient(90deg, #0f766e, #d97706, #7c3aed);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.healthRing {
  --ring: #10b981;
  width: 6rem;
  height: 6rem;
  flex: 0 0 6rem;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: conic-gradient(var(--ring) calc(var(--score) * 1%), #e5e7eb 0);
  position: relative;
  box-shadow: inset 0 0 0 1px rgba(15,23,42,.06);
}
.healthPulseCard.warn .healthRing { --ring: #f59e0b; }
.healthPulseCard.bad .healthRing { --ring: #ef4444; }
.healthPulseCard.celebrate .healthRing {
  --ring: #fbbf24;
  box-shadow: 0 0 0 6px rgba(251,191,36,.12), inset 0 0 0 1px rgba(15,23,42,.06);
}
.healthRing::before {
  content: "";
  position: absolute;
  inset: .62rem;
  border-radius: 50%;
  background: #fff;
}
.healthRing::after {
  content: "";
  position: absolute;
  inset: -.25rem;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(16,185,129,.22), transparent 64%);
  animation: healthPulse 2.8s ease-in-out infinite;
  z-index: -1;
}
.healthPulseCard.warn .healthRing::after { background: radial-gradient(circle, rgba(245,158,11,.24), transparent 64%); }
.healthPulseCard.bad .healthRing::after { background: radial-gradient(circle, rgba(239,68,68,.22), transparent 64%); }
.healthRing b {
  position: relative;
  z-index: 1;
  color: #0f172a;
  font-size: 1.2rem;
}
@keyframes healthPulse {
  0%, 100% { opacity: .38; transform: scale(.98); }
  50% { opacity: .9; transform: scale(1.08); }
}
@keyframes goalConfettiFloat {
  0%, 100% { transform: translateY(0) rotate(-4deg); opacity: .72; }
  50% { transform: translateY(.45rem) rotate(5deg); opacity: 1; }
}

.contractGrid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(295px, 1fr));
  gap: .9rem;
}
.contractCard {
  padding: 1rem;
  border-radius: 22px;
  border: 1px solid #dbe4ef;
  background: rgba(255,255,255,.92);
  box-shadow: 0 14px 36px rgba(15,23,42,.06);
  display: grid;
  gap: .8rem;
}
.contractCard.good { border-left: 7px solid #10b981; }
.contractCard.warn { border-left: 7px solid #f59e0b; }
.contractCard.danger { border-left: 7px solid #ef4444; }
.contractTop {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: flex-start;
}
.contractTop strong { display: block; color: #0f172a; font-size: 1.08rem; }
.contractTop small { display: block; color: #64748b; font-weight: 800; margin-top: .12rem; }
.statusPill {
  border-radius: 999px;
  padding: .32rem .58rem;
  font-size: .76rem;
  font-weight: 950;
  white-space: nowrap;
  background: #ecfdf5;
  color: #047857;
}
.statusPill.warn { background: #fffbeb; color: #b45309; }
.statusPill.danger { background: #fef2f2; color: #b91c1c; }
.contractAmount {
  font-size: 2rem;
  font-weight: 1000;
  color: #0f766e;
  letter-spacing: -.05em;
}
.contractAmount small {
  font-size: .82rem;
  color: #64748b;
  letter-spacing: 0;
  margin-left: .18rem;
}

.logTimeline {
  display: grid;
  gap: .8rem;
  position: relative;
}
.logTimeline::before {
  content: "";
  position: absolute;
  left: .58rem;
  top: .8rem;
  bottom: .8rem;
  width: 2px;
  background: linear-gradient(#14b8a6, #6366f1);
  opacity: .28;
}
.logItem {
  position: relative;
  display: grid;
  grid-template-columns: 1.2rem minmax(0, 1fr);
  gap: .75rem;
  padding: .85rem .9rem;
  border: 1px solid #dbe4ef;
  border-radius: 18px;
  background: rgba(255,255,255,.92);
}
.logDot {
  width: .82rem;
  height: .82rem;
  margin-top: .25rem;
  border-radius: 50%;
  background: linear-gradient(135deg, #14b8a6, #6366f1);
  box-shadow: 0 0 0 5px rgba(20,184,166,.10);
}
.logItem strong { color: #0f172a; }
.logItem small { display: block; color: #64748b; margin-top: .1rem; }
.logItem code {
  display: inline-block;
  margin-top: .35rem;
  color: #0f766e;
  background: #ecfdf5;
  border-radius: 999px;
  padding: .18rem .5rem;
  font-size: .72rem;
}

body[data-theme="banking"] {
  background: #050914 !important;
}
body[data-theme="banking"] .healthPulseCard,
body[data-theme="banking"] .contractCard,
body[data-theme="banking"] .logItem {
  background: rgba(15,23,42,.82);
  border-color: rgba(148,163,184,.22);
}
body[data-theme="banking"] .healthPulseCard strong,
body[data-theme="banking"] .healthRing b,
body[data-theme="banking"] .contractTop strong,
body[data-theme="banking"] .logItem strong {
  color: #f8fafc;
}
body[data-theme="banking"] .healthPulseCard span,
body[data-theme="banking"] .healthPulseCard small,
body[data-theme="banking"] .contractTop small,
body[data-theme="banking"] .logItem small {
  color: #cbd5e1;
}
body[data-theme="banking"] .healthRing::before {
  background: #0f172a;
}
body[data-theme="banking"] .healthPulseCard.celebrate {
  background:
    radial-gradient(circle at 88% 18%, rgba(251, 191, 36, .18), transparent 11rem),
    radial-gradient(circle at 8% 100%, rgba(45, 212, 191, .12), transparent 13rem),
    rgba(15,23,42,.86) !important;
  border-color: rgba(251,191,36,.34) !important;
}
body[data-theme="banking"] .healthPulseCard.celebrate strong {
  background: linear-gradient(90deg, #5eead4, #fbbf24, #c4b5fd);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
}
body[data-theme="banking"] .contractAmount { color: #5eead4; }
body[data-theme="banking"] .aliveHero {
  background: linear-gradient(135deg, rgba(15,23,42,.92), rgba(15,118,110,.42)) !important;
}

@media (max-width: 860px) {
  .overviewHealthGrid { grid-template-columns: 1fr; }
  .healthPulseCard { align-items: flex-start; }
  .healthRing { width: 5rem; height: 5rem; flex-basis: 5rem; }
}


/* v52 — remove Log tab, add ClearBudget logo and brighter colour palettes */
.mark {
  position: relative;
  overflow: hidden;
  background: linear-gradient(135deg, #37e6c0 0%, #6d8dff 52%, #a96dff 100%) !important;
  color: #06111c !important;
  isolation: isolate;
}
.mark::before {
  content: "";
  position: absolute;
  inset: -35%;
  background: conic-gradient(from 180deg, rgba(255,255,255,.0), rgba(255,255,255,.55), rgba(255,255,255,.0));
  animation: logoSpin 5.5s linear infinite;
  z-index: -1;
}
.markCoin {
  position: absolute;
  width: 1.34rem;
  height: 1.34rem;
  border-radius: 50%;
  background: rgba(255,255,255,.55);
  border: 2px solid rgba(6,17,28,.16);
  transform: translate(-.24rem, .16rem);
}
.markTick {
  position: relative;
  z-index: 1;
  font-weight: 1000;
  font-size: 1.18rem;
  transform: translate(.18rem, -.08rem);
  filter: drop-shadow(0 1px 0 rgba(255,255,255,.4));
}
@keyframes logoSpin {
  to { transform: rotate(360deg); }
}
.bigLogoMark {
  width: 5.8rem;
  height: 5.8rem;
  border-radius: 1.8rem;
  display: grid;
  place-items: center;
  position: relative;
  overflow: hidden;
  background: linear-gradient(135deg, #37e6c0, #6d8dff 55%, #a96dff);
  box-shadow: 0 22px 54px rgba(99,102,241,.22);
}
.bigLogoMark::before {
  content: "";
  position: absolute;
  inset: -40%;
  background: conic-gradient(from 180deg, rgba(255,255,255,.0), rgba(255,255,255,.58), rgba(255,255,255,.0));
  animation: logoSpin 6s linear infinite;
}
.bigLogoMark .markCoin {
  width: 2.6rem;
  height: 2.6rem;
  transform: translate(-.42rem, .32rem);
}
.bigLogoMark .markTick {
  color: #06111c;
  font-size: 2.4rem;
}
.brandPanel {
  background: linear-gradient(135deg, rgba(255,255,255,.96), rgba(236,253,245,.86), rgba(238,242,255,.92)) !important;
}
.brandPreview {
  display: flex;
  align-items: center;
  gap: 1.1rem;
}
.brandPreview strong {
  display: block;
  color: #0f172a;
  font-size: clamp(2rem, 4vw, 3.2rem);
  letter-spacing: -.08em;
  line-height: .95;
}
.brandPreview p {
  margin: .35rem 0 0;
  color: #64748b;
  font-weight: 750;
  max-width: 44rem;
}

/* Default/aurora palette */
html[data-theme="aurora"],
body[data-theme="aurora"] {
  --brand: #6366f1;
  --brand2: #14b8a6;
  --brand3: #8b5cf6;
  --brand4: #06b6d4;
  --good: #10b981;
  --warn: #f59e0b;
  --bad: #f43f5e;
}
body[data-theme="aurora"] {
  background:
    radial-gradient(circle at 8% 8%, rgba(99,102,241,.14), transparent 30rem),
    radial-gradient(circle at 92% 8%, rgba(20,184,166,.20), transparent 34rem),
    radial-gradient(circle at 50% 95%, rgba(139,92,246,.10), transparent 30rem),
    linear-gradient(135deg, #f4f8fb 0%, #edf8f7 50%, #f7f3ff 100%) !important;
}
body[data-theme="aurora"] .pageHero,
body[data-theme="aurora"] .settingsHero,
body[data-theme="aurora"] .commandHero,
body[data-theme="aurora"] .aliveHero {
  background:
    radial-gradient(circle at 86% 18%, rgba(20,184,166,.28), transparent 19rem),
    radial-gradient(circle at 18% 8%, rgba(99,102,241,.16), transparent 22rem),
    linear-gradient(135deg, #ffffff, #ecfdf5 58%, #eef2ff) !important;
}
body[data-theme="aurora"] button:not(.ghost):not(.miniButton):not(.dangerBtn) {
  background: linear-gradient(135deg, #14b8a6, #6366f1) !important;
  color: #fff !important;
}

/* Sunset coral palette */
html[data-theme="sunset"],
body[data-theme="sunset"] {
  --brand: #f97316;
  --brand2: #ec4899;
  --brand3: #8b5cf6;
  --brand4: #fb7185;
  --good: #10b981;
  --warn: #f59e0b;
  --bad: #e11d48;
}
body[data-theme="sunset"] {
  background:
    radial-gradient(circle at 8% 8%, rgba(249,115,22,.18), transparent 30rem),
    radial-gradient(circle at 90% 8%, rgba(236,72,153,.18), transparent 32rem),
    radial-gradient(circle at 55% 92%, rgba(139,92,246,.12), transparent 30rem),
    linear-gradient(135deg, #fff7ed, #fdf2f8 52%, #f5f3ff) !important;
}
body[data-theme="sunset"] .mark,
body[data-theme="sunset"] .bigLogoMark {
  background: linear-gradient(135deg, #f97316, #ec4899 55%, #8b5cf6) !important;
}
body[data-theme="sunset"] .pageHero,
body[data-theme="sunset"] .settingsHero,
body[data-theme="sunset"] .commandHero,
body[data-theme="sunset"] .aliveHero {
  background:
    radial-gradient(circle at 85% 14%, rgba(236,72,153,.22), transparent 20rem),
    radial-gradient(circle at 18% 8%, rgba(249,115,22,.18), transparent 22rem),
    linear-gradient(135deg, #ffffff, #fff7ed 55%, #fdf2f8) !important;
}
body[data-theme="sunset"] button:not(.ghost):not(.miniButton):not(.dangerBtn) {
  background: linear-gradient(135deg, #f97316, #ec4899) !important;
  color: #fff !important;
}
body[data-theme="sunset"] .topTabs a.active {
  background: linear-gradient(135deg, #f97316, #ec4899) !important;
}

/* Ocean blue palette */
html[data-theme="ocean"],
body[data-theme="ocean"] {
  --brand: #2563eb;
  --brand2: #06b6d4;
  --brand3: #0ea5e9;
  --brand4: #14b8a6;
  --good: #10b981;
  --warn: #f59e0b;
  --bad: #ef4444;
}
body[data-theme="ocean"] {
  background:
    radial-gradient(circle at 10% 8%, rgba(37,99,235,.16), transparent 31rem),
    radial-gradient(circle at 92% 8%, rgba(6,182,212,.22), transparent 34rem),
    radial-gradient(circle at 52% 95%, rgba(20,184,166,.12), transparent 30rem),
    linear-gradient(135deg, #eff6ff, #ecfeff 52%, #f8fafc) !important;
}
body[data-theme="ocean"] .mark,
body[data-theme="ocean"] .bigLogoMark {
  background: linear-gradient(135deg, #2563eb, #06b6d4 55%, #14b8a6) !important;
}
body[data-theme="ocean"] .pageHero,
body[data-theme="ocean"] .settingsHero,
body[data-theme="ocean"] .commandHero,
body[data-theme="ocean"] .aliveHero {
  background:
    radial-gradient(circle at 85% 14%, rgba(6,182,212,.24), transparent 20rem),
    radial-gradient(circle at 18% 8%, rgba(37,99,235,.16), transparent 22rem),
    linear-gradient(135deg, #ffffff, #eff6ff 55%, #ecfeff) !important;
}
body[data-theme="ocean"] button:not(.ghost):not(.miniButton):not(.dangerBtn) {
  background: linear-gradient(135deg, #2563eb, #06b6d4) !important;
  color: #fff !important;
}
body[data-theme="ocean"] .topTabs a.active {
  background: linear-gradient(135deg, #2563eb, #06b6d4) !important;
}

/* make top tabs a bit more colourful without the removed Log tab */
.topTabs a {
  position: relative;
  overflow: hidden;
}
.topTabs a::after {
  content: "";
  position: absolute;
  left: 14%;
  right: 14%;
  bottom: .22rem;
  height: 3px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--brand2), var(--brand), var(--brand3));
  transform: scaleX(0);
  transform-origin: center;
  transition: transform .18s ease;
}
.topTabs a:hover::after,
.topTabs a.active::after {
  transform: scaleX(1);
}

@media (max-width: 720px) {
  .brandPreview {
    align-items: flex-start;
    flex-direction: column;
  }
}


/* v54 — live tabs, Starling sync, richer pages */
.topTabs {
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: thin;
  justify-content: flex-start !important;
  gap: .35rem !important;
}
.topTabs a {
  flex: 0 0 auto;
  white-space: nowrap;
}
.topTabs::-webkit-scrollbar { height: 8px; }
.topTabs::-webkit-scrollbar-thumb {
  background: rgba(15,23,42,.16);
  border-radius: 999px;
}

.buttonLike {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}
.calendarTimeline {
  display: grid;
  gap: .75rem;
}
.calendarItem {
  display: grid;
  grid-template-columns: 5.8rem minmax(0, 1fr) auto;
  gap: 1rem;
  align-items: center;
  padding: .95rem 1rem;
  border: 1px solid #dbe4ef;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(15,23,42,.045);
}
.calendarItem.bill { border-left: 7px solid #f43f5e; }
.calendarItem.income { border-left: 7px solid #10b981; }
.calendarItem.goal { border-left: 7px solid #6366f1; }
.calendarItem.holiday { border-left: 7px solid #f59e0b; }
.calendarItem.contract { border-left: 7px solid #06b6d4; }
.dateBadge {
  display: grid;
  place-items: center;
  min-height: 4rem;
  border-radius: 16px;
  background: linear-gradient(135deg, #f8fafc, #eef2ff);
  border: 1px solid #dbe4ef;
}
.dateBadge strong { font-size: 1.35rem; color: #0f172a; }
.dateBadge small { color: #64748b; font-weight: 900; }
.calendarItem > div:nth-child(2) strong {
  display: block;
  color: #0f172a;
  font-size: 1.05rem;
}
.calendarItem > div:nth-child(2) small {
  display: block;
  color: #64748b;
  margin-top: .15rem;
  font-weight: 750;
}
.calendarItem > span {
  font-weight: 1000;
  color: #0f766e;
}

.insightList {
  display: grid;
  gap: .7rem;
}
.insightList > div {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: .8rem;
  padding: .85rem 1rem;
  border-radius: 16px;
  border: 1px solid #dbe4ef;
  background: #fff;
}
.insightList > div.bad {
  background: #fff1f2;
  border-color: #fecdd3;
}
.insightList > div.warn {
  background: #fffbeb;
  border-color: #fde68a;
}
.insightList > div.good {
  background: #ecfdf5;
  border-color: #a7f3d0;
}
.insightList strong { color: #0f172a; }
.insightList span { color: #64748b; font-weight: 800; }
.okBox {
  padding: 1rem;
  border-radius: 18px;
  background: #ecfdf5;
  border: 1px solid #a7f3d0;
  color: #047857;
  font-weight: 950;
}
.categoryBars {
  display: grid;
  gap: .9rem;
}
.categoryBars > div {
  display: grid;
  gap: .4rem;
}
.categoryBars span {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
}
.categoryBars strong { color: #0f172a; }
.categoryBars em {
  font-style: normal;
  color: #64748b;
  font-weight: 950;
}
.categoryBars b {
  height: .8rem;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--brand2), var(--brand), var(--brand3));
  min-width: 2rem;
}

.subscriptionGrid,
.wishlistGrid,
.rulesList {
  display: grid;
  gap: .8rem;
}
.subscriptionGrid {
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}
.subCard,
.wishCard,
.ruleCard {
  padding: 1rem;
  border: 1px solid #dbe4ef;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 12px 30px rgba(15,23,42,.045);
}
.subCard strong,
.wishCard strong,
.ruleCard strong {
  display: block;
  color: #0f172a;
  font-size: 1.05rem;
}
.subCard span,
.wishCard span {
  display: block;
  color: #0f766e;
  font-size: 1.45rem;
  font-weight: 1000;
  margin: .35rem 0;
}
.subCard small,
.wishCard small,
.ruleCard small {
  display: block;
  color: #64748b;
  font-weight: 800;
}
.wishCard,
.ruleCard {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.ruleCard {
  align-items: flex-start;
}
.starlingControlCard .settingsActions {
  flex-wrap: wrap;
}
#syncStarlingNowBtn {
  background: linear-gradient(135deg, #14b8a6, #6366f1) !important;
  color: #fff !important;
}
#syncStarlingNowBtn:disabled {
  opacity: .55;
  cursor: not-allowed;
}
.spaceLinkCard:not(.placeholder) {
  border-left: 6px solid #14b8a6;
}
.spaceLinkCard.placeholder {
  border-left: 6px solid #cbd5e1;
}
.spaceLinkCard .compactActions button:not(:disabled) {
  opacity: 1;
}

body[data-theme="banking"] .calendarItem,
body[data-theme="banking"] .subCard,
body[data-theme="banking"] .wishCard,
body[data-theme="banking"] .ruleCard,
body[data-theme="banking"] .insightList > div {
  background: rgba(15,23,42,.82);
  border-color: rgba(148,163,184,.22);
}
body[data-theme="banking"] .calendarItem > div:nth-child(2) strong,
body[data-theme="banking"] .subCard strong,
body[data-theme="banking"] .wishCard strong,
body[data-theme="banking"] .ruleCard strong,
body[data-theme="banking"] .categoryBars strong {
  color: #f8fafc;
}
body[data-theme="banking"] .dateBadge {
  background: rgba(15,23,42,.72);
  border-color: rgba(148,163,184,.22);
}
body[data-theme="banking"] .dateBadge strong {
  color: #f8fafc;
}

@media (max-width: 720px) {
  .calendarItem {
    grid-template-columns: 1fr;
  }
  .wishCard,
  .ruleCard {
    align-items: stretch;
    flex-direction: column;
  }
}


/* v61 — Backup clear/restore controls */
.dangerZonePanel {
  border-left: 7px solid #ef4444 !important;
}
.restorePanel {
  border-left: 7px solid #10b981 !important;
}
.restoreUploadButton {
  margin-top: .75rem;
}
.dangerZonePanel .dangerBtn {
  background: linear-gradient(135deg, #ef4444, #f97316) !important;
  color: #fff !important;
  box-shadow: 0 14px 28px rgba(239, 68, 68, .18);
}


/* v62 — no flicker on cloud refresh */
.content {
  animation: none !important;
}
.message {
  transition: opacity .15s ease, transform .15s ease;
}

/* v69 — Activity pending income/bill log strip */
.pendingLogPanelV69 {
  border-left: 7px solid rgba(20, 184, 166, .85);
}
.pendingLogPanelV69.quiet {
  border-left-color: rgba(148, 163, 184, .55);
}
.pendingLogGridV69 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin-top: 1rem;
}
.pendingLogGroupHead {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: .75rem;
  margin: 0 0 .55rem;
}
.pendingLogGroupHead strong {
  color: var(--text);
}
.pendingLogGroupHead small {
  color: var(--muted);
}
.pendingLogRowV69 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  gap: .8rem;
  padding: .85rem;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(255, 255, 255, .72);
  box-shadow: 0 12px 26px rgba(15, 23, 42, .06);
  margin-bottom: .55rem;
}
.pendingLogRowV69 strong,
.pendingLogRowV69 small {
  display: block;
}
.pendingLogRowV69 small {
  margin-top: .15rem;
  color: var(--muted);
}
.pendingLogRowV69 > span {
  font-weight: 900;
  white-space: nowrap;
}
.pendingLogRowV69.income {
  border-left: 5px solid #10b981;
}
.pendingLogRowV69.expense {
  border-left: 5px solid #f59e0b;
}
body[data-theme="banking"] .pendingLogRowV69 {
  background: rgba(15, 23, 42, .74);
  border-color: rgba(148, 163, 184, .24);
}
@media (max-width: 900px) {
  .pendingLogGridV69 {
    grid-template-columns: 1fr;
  }
  .pendingLogRowV69 {
    grid-template-columns: 1fr auto;
  }
  .pendingLogRowV69 button {
    grid-column: 1 / -1;
  }
}

/* v76 — Activity running spare and future forecast rows */
.runningSpareV76 {
  display: inline-flex;
  justify-content: flex-end;
  min-width: 6.8rem;
  font-weight: 1000;
  letter-spacing: -0.02em;
}
.runningSpareV76.good { color: #047857; }
.runningSpareV76.bad { color: #be123c; }
.mutedTextV76 { color: var(--muted); font-weight: 850; }
.futureActivityPanelV76 { margin-top: 18px; }
.futureActivityTableV76 .futureForecastRowV76 td {
  background: linear-gradient(135deg, rgba(99,102,241,.055), rgba(20,184,166,.045)) !important;
}
.futureActivityTableV76 .futureForecastRowV76 td:first-child {
  border-left-color: #6366f1 !important;
}
body[data-theme="banking"] .runningSpareV76.good { color: var(--good); }
body[data-theme="banking"] .runningSpareV76.bad { color: var(--bad); }
body[data-theme="banking"] .futureActivityTableV76 .futureForecastRowV76 td {
  background: rgba(109,141,255,.09) !important;
}
@media (max-width: 760px) {
  .runningSpareV76 { min-width: 5.8rem; }
}

.legacyDisabled { color: var(--muted); font-weight: 900; opacity: .75; }

/* v89 — Banking dark is now the default visual system.  The Settings page
   intentionally matches the supplied mock-up: dark bank shell, light summary
   cards, and deep navy control panels with roomy form controls. */
html[data-theme="banking"],
body[data-theme="banking"] {
  color-scheme: dark;
  --bg: #050914;
  --bg2: #07111f;
  --surface: rgba(9, 16, 31, .92);
  --surface2: rgba(13, 24, 43, .92);
  --surface3: rgba(17, 31, 55, .94);
  --text: #f7fbff;
  --soft: #d8e5f7;
  --muted: #91a5c3;
  --faint: #60718e;
  --line: rgba(151, 178, 214, .20);
  --line2: rgba(151, 178, 214, .32);
  --brand: #6d8dff;
  --brand2: #37e6c0;
  --brand3: #a96dff;
  --brand4: #3ab7ff;
  --good: #5cf0b2;
  --warn: #ffd166;
  --bad: #ff6b86;
  --shadow: 0 28px 90px rgba(0, 0, 0, .38);
  --shadow2: 0 16px 44px rgba(0, 0, 0, .26);
}

body[data-theme="banking"] {
  background:
    radial-gradient(circle at 8% -8%, rgba(109, 141, 255, .28), transparent 30rem),
    radial-gradient(circle at 94% 2%, rgba(55, 230, 192, .18), transparent 34rem),
    linear-gradient(180deg, #07111f 0%, #050914 44rem, #030712 100%) !important;
  color: var(--text) !important;
}

body[data-theme="banking"] .topbar {
  background: rgba(3, 8, 18, .88) !important;
  border-bottom-color: rgba(151, 178, 214, .16) !important;
  box-shadow: 0 16px 44px rgba(0, 0, 0, .30) !important;
}

body[data-theme="banking"] .appFrame {
  max-width: 1680px;
  padding-top: 1rem;
}

body[data-theme="banking"] .content {
  gap: 1.25rem !important;
}

body[data-theme="banking"] .topTabs {
  top: 76px !important;
  padding: .55rem !important;
  gap: .35rem !important;
  background: rgba(248, 250, 252, .96) !important;
  border: 1px solid rgba(203, 213, 225, .88) !important;
  border-radius: 22px !important;
  box-shadow: 0 18px 48px rgba(0, 0, 0, .26) !important;
}

body[data-theme="banking"] .topTabs a {
  min-height: 44px;
  padding: .78rem 1rem !important;
  color: #334155 !important;
  border-radius: 14px !important;
  background: transparent !important;
  font-weight: 950;
}

body[data-theme="banking"] .topTabs a:hover {
  color: #07111f !important;
  background: rgba(226, 232, 240, .88) !important;
}

body[data-theme="banking"] .topTabs a.active {
  color: #f8fafc !important;
  background: #07111f !important;
  box-shadow: inset 0 -3px 0 var(--brand2), 0 12px 24px rgba(2, 6, 23, .22) !important;
}

body[data-theme="banking"] .topTabs a::after {
  left: 18%;
  right: 18%;
  bottom: .36rem;
  background: linear-gradient(90deg, var(--brand2), var(--brand4)) !important;
}

body[data-theme="banking"] .v2InfoBar {
  color: var(--muted) !important;
  background: rgba(8, 15, 28, .78) !important;
  border-color: var(--line) !important;
}

body[data-theme="banking"] .pageHero,
body[data-theme="banking"] .settingsHero,
body[data-theme="banking"] .commandHero,
body[data-theme="banking"] .aliveHero,
body[data-theme="banking"] .panel,
body[data-theme="banking"] .goalCard,
body[data-theme="banking"] .miniCard,
body[data-theme="banking"] .empty,
body[data-theme="banking"] .sideCard {
  background:
    radial-gradient(circle at 100% 0%, rgba(55, 230, 192, .08), transparent 22rem),
    linear-gradient(180deg, rgba(16, 28, 50, .94), rgba(8, 15, 28, .96)) !important;
  color: var(--text) !important;
  border-color: var(--line) !important;
  box-shadow: var(--shadow2) !important;
}

body[data-theme="banking"] .settingsHero {
  gap: 1.4rem;
  min-height: 122px;
  padding: clamp(1.45rem, 2.4vw, 2.2rem) !important;
  border-radius: 26px !important;
}

body[data-theme="banking"] .settingsHero h1,
body[data-theme="banking"] .pageHero h1,
body[data-theme="banking"] .panel h2,
body[data-theme="banking"] .panel h3,
body[data-theme="banking"] .controlCard h2,
body[data-theme="banking"] .brand strong {
  color: var(--text) !important;
}

body[data-theme="banking"] .settingsHero p:not(.eyebrow),
body[data-theme="banking"] .pageHero p,
body[data-theme="banking"] .panelHead small,
body[data-theme="banking"] .muted,
body[data-theme="banking"] .email,
body[data-theme="banking"] label,
body[data-theme="banking"] label span {
  color: var(--muted) !important;
}

body[data-theme="banking"] .settingsSummaryGrid {
  gap: 1rem !important;
}

body[data-theme="banking"] .settingsSummaryGrid .metric,
body[data-theme="banking"] .brandPanel {
  background:
    radial-gradient(circle at 90% 0%, rgba(55, 230, 192, .08), transparent 18rem),
    linear-gradient(135deg, #ffffff 0%, #f8fafc 56%, #eef6f3 100%) !important;
  color: #0f172a !important;
  border: 1px solid #d9e3ee !important;
  box-shadow: 0 18px 46px rgba(15, 23, 42, .12) !important;
}

body[data-theme="banking"] .settingsSummaryGrid .metric {
  min-height: 104px;
  padding: 1.05rem !important;
  align-content: center;
  gap: .28rem;
}

body[data-theme="banking"] .settingsSummaryGrid .metric strong,
body[data-theme="banking"] .brandPanel h2,
body[data-theme="banking"] .brandPreview strong {
  color: #0f172a !important;
}

body[data-theme="banking"] .settingsSummaryGrid .metric small,
body[data-theme="banking"] .settingsSummaryGrid .metric span,
body[data-theme="banking"] .brandPanel .panelHead small,
body[data-theme="banking"] .brandPreview p {
  color: #64748b !important;
}

body[data-theme="banking"] .settingsControlGrid {
  grid-template-columns: minmax(0, 1.35fr) minmax(380px, .9fr) !important;
  gap: 1.25rem !important;
  align-items: stretch !important;
}

body[data-theme="banking"] .controlCard {
  padding: clamp(1.25rem, 1.7vw, 1.7rem) !important;
  border-radius: 26px !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(55, 230, 192, .10), transparent 20rem),
    linear-gradient(180deg, rgba(14, 25, 45, .98), rgba(6, 13, 25, .98)) !important;
  color: var(--text) !important;
  border-color: rgba(151, 178, 214, .22) !important;
  box-shadow: 0 22px 58px rgba(0, 0, 0, .28) !important;
}

body[data-theme="banking"] .controlHeader {
  gap: 1.25rem !important;
  margin-bottom: 1.15rem !important;
}

body[data-theme="banking"] .controlHeader p:not(.eyebrow) {
  color: var(--muted) !important;
  line-height: 1.62 !important;
}

body[data-theme="banking"] .settingsForm {
  gap: 1.05rem !important;
}

body[data-theme="banking"] .settingsInline,
body[data-theme="banking"] .toggleGrid {
  gap: .9rem !important;
}

body[data-theme="banking"] .settingsForm input,
body[data-theme="banking"] .settingsForm select,
body[data-theme="banking"] .settingsForm textarea {
  min-height: 52px;
  background: #f8fafc !important;
  color: #0f172a !important;
  border-color: #d9e3ee !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .72) !important;
}

body[data-theme="banking"] .settingsForm input:focus,
body[data-theme="banking"] .settingsForm select:focus,
body[data-theme="banking"] .settingsForm textarea:focus {
  border-color: rgba(55, 230, 192, .82) !important;
  box-shadow: 0 0 0 4px rgba(55, 230, 192, .14), inset 0 1px 0 rgba(255, 255, 255, .72) !important;
}

body[data-theme="banking"] .toggleCard {
  min-height: 82px;
  padding: 1rem !important;
  background: #f8fafc !important;
  color: #0f172a !important;
  border-color: #d9e3ee !important;
  box-shadow: 0 10px 22px rgba(0, 0, 0, .10) !important;
}

body[data-theme="banking"] .toggleCard:hover {
  background: #ecfdf5 !important;
  border-color: rgba(20, 184, 166, .58) !important;
}

body[data-theme="banking"] .toggleCard strong {
  color: #0f172a !important;
}

body[data-theme="banking"] .toggleCard small {
  color: #64748b !important;
}

body[data-theme="banking"] .settingsActions {
  gap: .8rem !important;
  padding-top: .15rem;
}

body[data-theme="banking"] button:not(.ghost):not(.miniButton):not(.dangerBtn):not(.warnBtn) {
  background: linear-gradient(135deg, #0f172a, #172554) !important;
  color: #f8fafc !important;
  box-shadow: 0 14px 28px rgba(2, 6, 23, .22), inset 0 -3px 0 rgba(55, 230, 192, .46) !important;
}

body[data-theme="banking"] .controlCard button:not(.ghost):not(.miniButton):not(.dangerBtn):not(.warnBtn),
body[data-theme="banking"] #syncStarlingNowBtn {
  background: linear-gradient(135deg, #37e6c0, #6d8dff) !important;
  color: #06111c !important;
  box-shadow: 0 14px 30px rgba(55, 230, 192, .18), inset 0 1px 0 rgba(255, 255, 255, .42) !important;
}

body[data-theme="banking"] button.ghost,
body[data-theme="banking"] .miniButton {
  background: rgba(255, 255, 255, .08) !important;
  color: var(--soft) !important;
  border-color: var(--line) !important;
}

body[data-theme="banking"] .tableWrap,
body[data-theme="banking"] .activityTable {
  background: rgba(7, 14, 27, .78) !important;
  border-color: var(--line) !important;
}

body[data-theme="banking"] th {
  color: var(--muted) !important;
  background: rgba(255, 255, 255, .04) !important;
}

body[data-theme="banking"] td {
  color: var(--soft) !important;
}

body[data-theme="banking"] .activityTable .txRow.income td {
  background: linear-gradient(90deg, rgba(92, 240, 178, .13), rgba(92, 240, 178, .05)) !important;
  border-color: rgba(92, 240, 178, .22) !important;
}

body[data-theme="banking"] .activityTable .txRow.expense td {
  background: linear-gradient(90deg, rgba(255, 107, 134, .12), rgba(255, 107, 134, .045)) !important;
  border-color: rgba(255, 107, 134, .20) !important;
}

body[data-theme="banking"] .activityTable .txRow.transfer td,
body[data-theme="banking"] .futureActivityTableV76 .futureForecastRowV76 td {
  background: linear-gradient(90deg, rgba(109, 141, 255, .13), rgba(109, 141, 255, .05)) !important;
  border-color: rgba(109, 141, 255, .20) !important;
}

body[data-theme="banking"] .billCard,
body[data-theme="banking"] .goalManagerRow,
body[data-theme="banking"] .spaceLinkCard,
body[data-theme="banking"] .calendarItem,
body[data-theme="banking"] .subCard,
body[data-theme="banking"] .wishCard,
body[data-theme="banking"] .ruleCard,
body[data-theme="banking"] .pendingLogRowV69,
body[data-theme="banking"] .logItem,
body[data-theme="banking"] .healthPulseCard,
body[data-theme="banking"] .contractCard {
  background: rgba(15, 23, 42, .80) !important;
  color: var(--text) !important;
  border-color: rgba(148, 163, 184, .24) !important;
}

body[data-theme="banking"] .billCard .dataList dd,
body[data-theme="banking"] .goalManagerRow strong,
body[data-theme="banking"] .spaceLinkCard strong,
body[data-theme="banking"] .calendarItem > div:nth-child(2) strong,
body[data-theme="banking"] .subCard strong,
body[data-theme="banking"] .wishCard strong,
body[data-theme="banking"] .ruleCard strong,
body[data-theme="banking"] .logItem strong,
body[data-theme="banking"] .healthPulseCard strong,
body[data-theme="banking"] .contractTop strong {
  color: var(--text) !important;
}

body[data-theme="banking"] .billCard .dataList dt,
body[data-theme="banking"] .goalManagerRow span,
body[data-theme="banking"] .spaceLinkCard span,
body[data-theme="banking"] .spaceLinkCard small,
body[data-theme="banking"] .calendarItem > div:nth-child(2) small,
body[data-theme="banking"] .subCard small,
body[data-theme="banking"] .wishCard small,
body[data-theme="banking"] .ruleCard small,
body[data-theme="banking"] .logItem small,
body[data-theme="banking"] .healthPulseCard span,
body[data-theme="banking"] .healthPulseCard small,
body[data-theme="banking"] .contractTop small {
  color: var(--muted) !important;
}

@media (max-width: 980px) {
  body[data-theme="banking"] .settingsControlGrid {
    grid-template-columns: 1fr !important;
  }

  body[data-theme="banking"] .topTabs {
    top: 68px !important;
  }
}

@media (max-width: 640px) {
  body[data-theme="banking"] .settingsSummaryGrid,
  body[data-theme="banking"] .settingsInline,
  body[data-theme="banking"] .toggleGrid {
    grid-template-columns: 1fr !important;
  }

  body[data-theme="banking"] .topTabs a {
    padding: .72rem .86rem !important;
  }
}

/* v90 — reduce the white. Banking dark now stays dark across the nav, cards,
   brand panel, inputs and toggle controls, with only small accent pills kept
   bright for status. */
body[data-theme="banking"] .topTabs {
  background:
    linear-gradient(180deg, rgba(14, 25, 45, .96), rgba(6, 13, 25, .98)) !important;
  border-color: rgba(151, 178, 214, .22) !important;
  box-shadow: 0 18px 48px rgba(0, 0, 0, .34), inset 0 1px 0 rgba(255, 255, 255, .06) !important;
}

body[data-theme="banking"] .topTabs a {
  color: #9badc9 !important;
}

body[data-theme="banking"] .topTabs a:hover {
  color: #f7fbff !important;
  background: rgba(255, 255, 255, .075) !important;
}

body[data-theme="banking"] .topTabs a.active {
  color: #f7fbff !important;
  background:
    linear-gradient(135deg, rgba(109, 141, 255, .34), rgba(55, 230, 192, .16)) !important;
  border: 1px solid rgba(55, 230, 192, .46) !important;
  box-shadow: inset 0 -3px 0 var(--brand2), 0 14px 30px rgba(0, 0, 0, .28) !important;
}

body[data-theme="banking"] .settingsSummaryGrid .metric,
body[data-theme="banking"] .brandPanel {
  background:
    radial-gradient(circle at 88% -18%, rgba(55, 230, 192, .13), transparent 20rem),
    linear-gradient(180deg, rgba(17, 31, 55, .96), rgba(8, 15, 28, .98)) !important;
  color: var(--text) !important;
  border-color: rgba(151, 178, 214, .24) !important;
  box-shadow: 0 20px 50px rgba(0, 0, 0, .28), inset 0 1px 0 rgba(255, 255, 255, .05) !important;
}

body[data-theme="banking"] .settingsSummaryGrid .metric strong,
body[data-theme="banking"] .brandPanel h2,
body[data-theme="banking"] .brandPreview strong {
  color: var(--text) !important;
}

body[data-theme="banking"] .settingsSummaryGrid .metric small,
body[data-theme="banking"] .settingsSummaryGrid .metric span,
body[data-theme="banking"] .brandPanel .panelHead small,
body[data-theme="banking"] .brandPreview p {
  color: var(--muted) !important;
}

body[data-theme="banking"] .brandPanel .pill.good,
body[data-theme="banking"] .settingsHero .pill.good,
body[data-theme="banking"] .controlCard .status.good {
  background: rgba(92, 240, 178, .13) !important;
  border-color: rgba(92, 240, 178, .36) !important;
  color: #bfffe7 !important;
}

body[data-theme="banking"] .settingsForm input,
body[data-theme="banking"] .settingsForm select,
body[data-theme="banking"] .settingsForm textarea,
body[data-theme="banking"] .toggleCard,
body[data-theme="banking"] .syncFlow,
body[data-theme="banking"] .syncFlow span {
  background: rgba(7, 17, 31, .88) !important;
  color: var(--text) !important;
  border-color: rgba(151, 178, 214, .24) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04), 0 10px 24px rgba(0, 0, 0, .14) !important;
}

body[data-theme="banking"] .settingsForm input::placeholder,
body[data-theme="banking"] .settingsForm textarea::placeholder {
  color: #6f809c !important;
}

body[data-theme="banking"] .settingsForm input:focus,
body[data-theme="banking"] .settingsForm select:focus,
body[data-theme="banking"] .settingsForm textarea:focus {
  background: rgba(10, 22, 40, .96) !important;
  border-color: rgba(55, 230, 192, .62) !important;
  box-shadow: 0 0 0 4px rgba(55, 230, 192, .10), inset 0 1px 0 rgba(255, 255, 255, .05) !important;
}

body[data-theme="banking"] .toggleCard:hover {
  background: rgba(13, 30, 52, .94) !important;
  border-color: rgba(55, 230, 192, .40) !important;
}

body[data-theme="banking"] .toggleCard strong,
body[data-theme="banking"] .syncFlow span {
  color: var(--text) !important;
}

body[data-theme="banking"] .toggleCard small,
body[data-theme="banking"] .syncFlow {
  color: var(--muted) !important;
}

body[data-theme="banking"] .toggleCard input {
  accent-color: var(--brand2);
}

body[data-theme="banking"] .controlCard {
  background:
    radial-gradient(circle at 100% -10%, rgba(55, 230, 192, .10), transparent 19rem),
    linear-gradient(180deg, rgba(13, 25, 47, .98), rgba(3, 10, 21, .98)) !important;
}

body[data-theme="banking"] .settingsPanel .tableWrap td:first-child,
body[data-theme="banking"] .categoryPill,
body[data-theme="banking"] .dateBadge,
body[data-theme="banking"] .okBox {
  background: rgba(7, 17, 31, .84) !important;
  color: var(--soft) !important;
  border-color: rgba(151, 178, 214, .24) !important;
}

/* v91 — all-tab dark pass. Earlier redesign work fixed Settings first; this
   catches the old light component families still used by Overview, Activity,
   Bills, Goals, Holiday, Starling and Health. */
body[data-theme="banking"] input,
body[data-theme="banking"] textarea,
body[data-theme="banking"] select,
body[data-theme="banking"] .metric,
body[data-theme="banking"] .metric.accent,
body[data-theme="banking"] .priorityStack,
body[data-theme="banking"] .priorityItem,
body[data-theme="banking"] .compactRows > div,
body[data-theme="banking"] .holidayTabs,
body[data-theme="banking"] .checkCard,
body[data-theme="banking"] .goalModeHero,
body[data-theme="banking"] .goalModeCard,
body[data-theme="banking"] .customGoalBudgetV107,
body[data-theme="banking"] .customGoalBudgetStatsV107 > div,
body[data-theme="banking"] .movementGoalMatchV108,
body[data-theme="banking"] .movementVerdictV108,
body[data-theme="banking"] .movementMatchSummaryV108 > div,
body[data-theme="banking"] .movementGoalRowV108,
body[data-theme="banking"] .goalPlannerNoteV38,
body[data-theme="banking"] .deadlineRowV38,
body[data-theme="banking"] .reserveActionCard,
body[data-theme="banking"] .smartActionsV38 article,
body[data-theme="banking"] .deadlineReserveV38,
body[data-theme="banking"] .goalSplitV38,
body[data-theme="banking"] .projectionV38,
body[data-theme="banking"] .projectionV49,
body[data-theme="banking"] .healthOkStripV49,
body[data-theme="banking"] .healthWarningStripV49,
body[data-theme="banking"] .healthScoreCardV49,
body[data-theme="banking"] .healthCheckListV49 > div,
body[data-theme="banking"] .healthMiniStatsV49 > div,
body[data-theme="banking"] .trustRulesV49 > div,
body[data-theme="banking"] .warningList > div {
  background:
    radial-gradient(circle at 100% -12%, rgba(55, 230, 192, .10), transparent 18rem),
    linear-gradient(180deg, rgba(17, 31, 55, .94), rgba(7, 14, 27, .96)) !important;
  color: var(--text) !important;
  border-color: rgba(151, 178, 214, .24) !important;
  box-shadow: 0 14px 34px rgba(0, 0, 0, .20), inset 0 1px 0 rgba(255, 255, 255, .045) !important;
}

body[data-theme="banking"] input,
body[data-theme="banking"] textarea,
body[data-theme="banking"] select {
  background: rgba(7, 17, 31, .92) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04) !important;
}

body[data-theme="banking"] input::placeholder,
body[data-theme="banking"] textarea::placeholder {
  color: #6f809c !important;
}

body[data-theme="banking"] input:focus,
body[data-theme="banking"] textarea:focus,
body[data-theme="banking"] select:focus {
  background: rgba(10, 22, 40, .98) !important;
  border-color: rgba(55, 230, 192, .62) !important;
  box-shadow: 0 0 0 4px rgba(55, 230, 192, .10), inset 0 1px 0 rgba(255, 255, 255, .05) !important;
}

body[data-theme="banking"] .metric strong,
body[data-theme="banking"] .metric.accent strong,
body[data-theme="banking"] .priorityStack h2,
body[data-theme="banking"] .priorityItem strong,
body[data-theme="banking"] .compactRows strong,
body[data-theme="banking"] .goalModeHero strong,
body[data-theme="banking"] .goalModeCard strong,
body[data-theme="banking"] .customGoalBudgetStatsV107 strong,
body[data-theme="banking"] .movementVerdictV108 strong,
body[data-theme="banking"] .movementMatchSummaryV108 strong,
body[data-theme="banking"] .movementGoalRowV108 strong,
body[data-theme="banking"] .movementGoalRowV108 h3,
body[data-theme="banking"] .goalPlannerNoteV38 strong,
body[data-theme="banking"] .deadlineRowV38 strong,
body[data-theme="banking"] .deadlineRowV38 b,
body[data-theme="banking"] .reserveActionCard strong,
body[data-theme="banking"] .smartActionsV38 article strong,
body[data-theme="banking"] .healthOkStripV49 strong,
body[data-theme="banking"] .healthWarningStripV49 strong,
body[data-theme="banking"] .healthScoreCardV49 strong,
body[data-theme="banking"] .healthCheckListV49 strong,
body[data-theme="banking"] .healthMiniStatsV49 strong,
body[data-theme="banking"] .trustRulesV49 strong {
  color: var(--text) !important;
}

body[data-theme="banking"] .metric small,
body[data-theme="banking"] .metric span,
body[data-theme="banking"] .priorityStack small,
body[data-theme="banking"] .priorityItem span,
body[data-theme="banking"] .compactRows span,
body[data-theme="banking"] .compactRows small,
body[data-theme="banking"] .goalModeHero small,
body[data-theme="banking"] .goalModeCard small,
body[data-theme="banking"] .customGoalBudgetStatsV107 small,
body[data-theme="banking"] .movementVerdictV108 span,
body[data-theme="banking"] .movementMatchSummaryV108 small,
body[data-theme="banking"] .movementMatchSummaryV108 span,
body[data-theme="banking"] .movementGoalRowV108 small,
body[data-theme="banking"] .movementGoalRowV108 span,
body[data-theme="banking"] .goalPlannerNoteV38,
body[data-theme="banking"] .deadlineRowV38 small,
body[data-theme="banking"] .deadlineRowV38 span,
body[data-theme="banking"] .reserveActionCard span,
body[data-theme="banking"] .smartActionsV38 article span,
body[data-theme="banking"] .healthOkStripV49 span,
body[data-theme="banking"] .healthWarningStripV49 span,
body[data-theme="banking"] .healthScoreCardV49 span,
body[data-theme="banking"] .healthScoreCardV49 small,
body[data-theme="banking"] .healthCheckListV49 small,
body[data-theme="banking"] .healthMiniStatsV49 small,
body[data-theme="banking"] .trustRulesV49 span {
  color: var(--muted) !important;
}

body[data-theme="banking"] .metric.accent,
body[data-theme="banking"] .goalModeHero.active,
body[data-theme="banking"] .goalModeCard.active,
body[data-theme="banking"] .customGoalBudgetV107.active,
body[data-theme="banking"] .deadlineRowV38.ok,
body[data-theme="banking"] .movementVerdictV108.ok,
body[data-theme="banking"] .movementGoalRowV108.doable,
body[data-theme="banking"] .healthOkStripV49,
body[data-theme="banking"] .healthScoreCardV49.good,
body[data-theme="banking"] .healthCheckListV49 > div.ok {
  border-color: rgba(92, 240, 178, .34) !important;
  background:
    radial-gradient(circle at 100% -12%, rgba(92, 240, 178, .14), transparent 18rem),
    linear-gradient(180deg, rgba(16, 45, 50, .92), rgba(7, 18, 27, .96)) !important;
}

body[data-theme="banking"] .deadlineRowV38.late,
body[data-theme="banking"] .movementVerdictV108.bad,
body[data-theme="banking"] .movementGoalRowV108.short,
body[data-theme="banking"] .healthWarningStripV49,
body[data-theme="banking"] .healthScoreCardV49.warn,
body[data-theme="banking"] .healthCheckListV49 > div.bad {
  border-color: rgba(255, 107, 134, .32) !important;
  background:
    radial-gradient(circle at 100% -12%, rgba(255, 107, 134, .12), transparent 18rem),
    linear-gradient(180deg, rgba(45, 20, 38, .92), rgba(12, 13, 25, .96)) !important;
}

body[data-theme="banking"] .holidayTabs button {
  background: rgba(255, 255, 255, .06) !important;
  color: var(--muted) !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

body[data-theme="banking"] .holidayTabs button:hover {
  color: var(--text) !important;
  background: rgba(255, 255, 255, .09) !important;
}

body[data-theme="banking"] .holidayTabs .active,
body[data-theme="banking"] .segmentedControl button.active {
  color: #06111c !important;
  background: linear-gradient(135deg, var(--brand2), var(--brand4)) !important;
  border-color: rgba(55, 230, 192, .42) !important;
}

body[data-theme="banking"] .deadlineRowV38 em,
body[data-theme="banking"] .movementGoalRowV108 em,
body[data-theme="banking"] .priorityItem em,
body[data-theme="banking"] .categoryBars em {
  color: var(--soft) !important;
  background: rgba(255, 255, 255, .07) !important;
  border-color: rgba(151, 178, 214, .20) !important;
}

/* v91b — explicit background-colour cleanup for older rules that set
   background-color separately from background-image. */
body[data-theme="banking"] .metric,
body[data-theme="banking"] .metric.accent,
body[data-theme="banking"] .priorityStack,
body[data-theme="banking"] .priorityItem,
body[data-theme="banking"] .statRibbon article,
body[data-theme="banking"] .compactRows > div,
body[data-theme="banking"] .goalReserveSummaryV38 > div,
body[data-theme="banking"] .goalLogicMiniV38 .metric,
body[data-theme="banking"] .movementGoalMatchV108,
body[data-theme="banking"] .movementVerdictV108,
body[data-theme="banking"] .movementMatchSummaryV108 > div,
body[data-theme="banking"] .movementGoalRowV108,
body[data-theme="banking"] .reserveNotice,
body[data-theme="banking"] .splitRowsV38 > div,
body[data-theme="banking"] .projectionRowV48,
body[data-theme="banking"] .projectionLane,
body[data-theme="banking"] .deadlineRowV38,
body[data-theme="banking"] .goalPlannerNoteV38,
body[data-theme="banking"] .smartActionGridV38 > article,
body[data-theme="banking"] .holidayTabs,
body[data-theme="banking"] .healthOkStripV49,
body[data-theme="banking"] .healthWarningStripV49,
body[data-theme="banking"] .healthStatusGridV49 .metric {
  background:
    radial-gradient(circle at 100% -12%, rgba(55, 230, 192, .10), transparent 18rem),
    linear-gradient(180deg, rgba(17, 31, 55, .94), rgba(7, 14, 27, .96)),
    #0b1628 !important;
  background-color: #0b1628 !important;
}

body[data-theme="banking"] .statRibbon article.warn,
body[data-theme="banking"] .reserveNotice,
body[data-theme="banking"] .movementVerdictV108.warn,
body[data-theme="banking"] .movementGoalRowV108.tight,
body[data-theme="banking"] .deadlineRowV38.late,
body[data-theme="banking"] .healthWarningStripV49 {
  background:
    radial-gradient(circle at 100% -12%, rgba(255, 209, 102, .12), transparent 18rem),
    linear-gradient(180deg, rgba(45, 30, 20, .92), rgba(12, 13, 25, .96)),
    #160f13 !important;
  background-color: #160f13 !important;
}

body[data-theme="banking"] input,
body[data-theme="banking"] textarea,
body[data-theme="banking"] select {
  background-image: none !important;
  background-color: #07111f !important;
}

/* v92 — Money Movement / reconciliation centre */
.movementHeroV92 {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  gap: 1.25rem;
}

.movementHeroV92::after {
  content: "";
  position: absolute;
  inset: auto -8rem -10rem auto;
  width: 24rem;
  height: 24rem;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(55, 230, 192, .20), transparent 68%);
  pointer-events: none;
}

.movementMonthCardV92 {
  min-width: 15rem;
  border: 1px solid var(--line);
  border-radius: 1.4rem;
  padding: 1rem 1.1rem;
  background:
    radial-gradient(circle at 100% 0%, rgba(92, 240, 178, .18), transparent 12rem),
    rgba(255, 255, 255, .06);
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: .2rem;
  box-shadow: var(--shadowSoft);
  z-index: 1;
}

.movementMonthCardV92 span,
.movementMonthCardV92 small,
.movementHintV92 {
  color: var(--muted);
}

.movementMonthCardV92 strong {
  color: var(--text);
  font-size: clamp(1.45rem, 3vw, 2.4rem);
  line-height: 1;
}

.movementToolbarV92 {
  margin: -1rem 0 1.25rem;
  padding: .75rem;
  border: 1px solid var(--line);
  border-radius: 1.4rem;
  background:
    linear-gradient(135deg, rgba(12, 26, 46, .94), rgba(7, 14, 27, .96)),
    #0b1628;
  display: flex;
  align-items: center;
  gap: .65rem;
  flex-wrap: wrap;
}

.movementToolbarV92 button {
  min-height: 2.75rem;
}

.movementHintV92 {
  margin-left: auto;
  font-size: .86rem;
}

.movementMetricsV92 {
  margin-bottom: 1.25rem;
}

.movementGridV92 {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(20rem, .75fr);
  gap: 1.25rem;
  margin-bottom: 1.25rem;
}

.movementBreakdownV92,
.movementAlertsV92,
.movementRowsV92 {
  display: grid;
  gap: .75rem;
}

.movementBreakdownV92 > div,
.movementAlertsV92 > div,
.movementRowV92 {
  border: 1px solid var(--line);
  border-radius: 1.15rem;
  padding: .95rem 1rem;
  background:
    radial-gradient(circle at 100% -25%, rgba(74, 144, 226, .12), transparent 12rem),
    linear-gradient(180deg, rgba(18, 34, 58, .82), rgba(8, 17, 31, .92)),
    #0b1628;
}

.movementBreakdownV92 > div,
.movementRowV92 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.movementBreakdownV92 span,
.movementRowV92 div {
  min-width: 0;
}

.movementBreakdownV92 strong,
.movementAlertsV92 strong,
.movementRowV92 strong {
  display: block;
  color: var(--text);
}

.movementBreakdownV92 small,
.movementAlertsV92 span,
.movementRowV92 span {
  display: block;
  color: var(--muted);
  margin-top: .15rem;
}

.movementBreakdownV92 b,
.movementRowV92 b {
  color: var(--text);
  white-space: nowrap;
}

.movementBreakdownV92 .good b,
.movementRowV92.good b {
  color: var(--good);
}

.movementBreakdownV92 .bad b,
.movementRowV92.bad b {
  color: var(--bad);
}

.movementAlertsV92 > div.good,
.movementRowV92.good {
  border-color: rgba(92, 240, 178, .30);
  background:
    radial-gradient(circle at 100% -25%, rgba(92, 240, 178, .16), transparent 12rem),
    linear-gradient(180deg, rgba(16, 45, 50, .88), rgba(7, 18, 27, .94)),
    #0b1628;
}

.movementAlertsV92 > div.warn,
.movementRowV92.warn {
  border-color: rgba(255, 209, 102, .30);
  background:
    radial-gradient(circle at 100% -25%, rgba(255, 209, 102, .13), transparent 12rem),
    linear-gradient(180deg, rgba(49, 37, 18, .86), rgba(13, 16, 25, .94)),
    #160f13;
}

body[data-theme="banking"] .movementMonthCardV92,
body[data-theme="banking"] .movementToolbarV92,
body[data-theme="banking"] .movementBreakdownV92 > div,
body[data-theme="banking"] .movementAlertsV92 > div,
body[data-theme="banking"] .movementRowV92 {
  color: var(--text) !important;
  background-color: #0b1628 !important;
}

@media (max-width: 980px) {
  .movementHeroV92,
  .movementGridV92 {
    grid-template-columns: 1fr;
  }

  .movementHeroV92 {
    display: grid;
  }

  .movementMonthCardV92 {
    min-width: 0;
  }

  .movementHintV92 {
    margin-left: 0;
    width: 100%;
  }
}

@media (max-width: 640px) {
  .movementToolbarV92 button {
    width: 100%;
  }

  .movementBreakdownV92 > div,
  .movementRowV92 {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* v99 — banking-dark sidebar shell and final white-box cleanup.
   The earlier v36/v89 light redesign blocks are still present for other
   palettes, so this sits at the end and deliberately wins in banking mode. */
html[data-theme="banking"],
body[data-theme="banking"] {
  color-scheme: dark;
  --bg: #030712;
  --bg2: #07111f;
  --surface: rgba(8, 15, 28, .94);
  --surface2: rgba(12, 24, 43, .94);
  --surface3: rgba(17, 31, 55, .96);
  --text: #f8fafc;
  --soft: #dce8ff;
  --muted: #9badc9;
  --faint: #657794;
  --line: rgba(151, 178, 214, .22);
  --line2: rgba(151, 178, 214, .34);
  --brand: #6d8dff;
  --brand2: #37e6c0;
  --brand3: #a96dff;
  --brand4: #3ab7ff;
  --good: #5cf0b2;
  --warn: #ffd166;
  --bad: #ff6b86;
  --shadow: 0 30px 90px rgba(0, 0, 0, .44);
  --shadow2: 0 18px 48px rgba(0, 0, 0, .30);
}

body[data-theme="banking"] {
  background:
    radial-gradient(circle at 10% -10%, rgba(109, 141, 255, .28), transparent 30rem),
    radial-gradient(circle at 96% 0%, rgba(55, 230, 192, .18), transparent 36rem),
    radial-gradient(circle at 50% 112%, rgba(169, 109, 255, .12), transparent 36rem),
    linear-gradient(180deg, #07111f 0%, #050914 34rem, #030712 100%) !important;
  color: var(--text) !important;
}

body[data-theme="banking"] .topbar {
  position: sticky !important;
  top: 0 !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  border-radius: 0 !important;
  background: rgba(3, 8, 18, .82) !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(151, 178, 214, .16) !important;
  box-shadow: 0 16px 44px rgba(0, 0, 0, .30) !important;
  backdrop-filter: blur(22px) saturate(145%) !important;
}

body[data-theme="banking"] .brand strong,
body[data-theme="banking"] .topbar .brand strong {
  color: var(--text) !important;
}

body[data-theme="banking"] .brand small,
body[data-theme="banking"] .email {
  color: var(--muted) !important;
}

body[data-theme="banking"] .appFrame,
body[data-theme="banking"] .topTabs {
  display: none !important;
}

.appShell {
  width: min(1840px, calc(100% - 2rem));
  margin: 0 auto;
  padding: 1rem 0 3rem;
  display: grid;
  grid-template-columns: 272px minmax(0, 1fr);
  gap: 1.1rem;
  align-items: start;
}

.desktopNav {
  position: sticky;
  top: 5.25rem;
  display: grid;
  gap: .9rem;
  max-height: calc(100vh - 6.3rem);
  overflow: auto;
  padding: .85rem;
  border: 1px solid var(--line);
  border-radius: 26px;
  background:
    radial-gradient(circle at 100% -10%, rgba(55, 230, 192, .12), transparent 18rem),
    linear-gradient(180deg, rgba(13, 25, 47, .96), rgba(3, 10, 21, .98)),
    #07111f;
  box-shadow: var(--shadow2);
  backdrop-filter: blur(20px) saturate(140%);
}

.desktopNavHead,
.desktopNavFoot {
  padding: .78rem .8rem;
  border: 1px solid rgba(151, 178, 214, .18);
  border-radius: 18px;
  background: rgba(255, 255, 255, .045);
}

.desktopNavHead strong {
  display: block;
  margin: .16rem 0 .22rem;
  color: var(--text);
  font-size: 1.08rem;
  line-height: 1.05;
}

.desktopNavHead small,
.desktopNavFoot small {
  display: block;
  color: var(--muted);
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.sideTabs {
  display: grid;
  gap: .28rem;
}

.sideTabs a {
  position: relative;
  display: flex;
  align-items: center;
  gap: .72rem;
  min-height: 46px;
  padding: .68rem .72rem;
  border: 1px solid transparent;
  border-radius: 16px;
  color: var(--muted);
  text-decoration: none;
  font-weight: 950;
  transition: transform .16s ease, background .16s ease, border-color .16s ease, color .16s ease;
}

.sideTabs a:hover {
  color: var(--text);
  background: rgba(255, 255, 255, .07);
  border-color: rgba(151, 178, 214, .18);
  transform: translateX(2px);
}

.sideTabs a.active {
  color: var(--text);
  background:
    linear-gradient(135deg, rgba(109, 141, 255, .34), rgba(55, 230, 192, .16)),
    rgba(255, 255, 255, .05);
  border-color: rgba(55, 230, 192, .48);
  box-shadow: inset 4px 0 0 var(--brand2), 0 14px 30px rgba(0, 0, 0, .24);
}

.sideTabs .navIcon {
  width: 2rem;
  height: 2rem;
  border-radius: 12px;
  background: rgba(255, 255, 255, .07);
  color: var(--brand2);
}

.sideTabs a.active .navIcon {
  background: rgba(55, 230, 192, .18);
  color: #bfffe7;
}

.appMain {
  min-width: 0;
  display: grid;
  gap: 1rem;
}

body[data-theme="banking"] .v2InfoBar,
body[data-theme="banking"] .message {
  background:
    linear-gradient(135deg, rgba(13, 25, 47, .94), rgba(5, 12, 24, .96)),
    #07111f !important;
  color: var(--muted) !important;
  border-color: var(--line) !important;
  box-shadow: var(--shadow2) !important;
}

body[data-theme="banking"] .v2InfoBar strong,
body[data-theme="banking"] .message strong {
  color: var(--brand2) !important;
}

body[data-theme="banking"] .authShell {
  max-width: 1320px !important;
  padding-top: clamp(1.2rem, 5vw, 4.5rem) !important;
}

body[data-theme="banking"] .authHero,
body[data-theme="banking"] .authCard,
body[data-theme="banking"] .pageHero,
body[data-theme="banking"] .settingsHero,
body[data-theme="banking"] .commandHero,
body[data-theme="banking"] .aliveHero,
body[data-theme="banking"] .panel,
body[data-theme="banking"] .metric,
body[data-theme="banking"] .metric.accent,
body[data-theme="banking"] .goalCard,
body[data-theme="banking"] .miniCard,
body[data-theme="banking"] .empty,
body[data-theme="banking"] .sideCard,
body[data-theme="banking"] .warningBox,
body[data-theme="banking"] .priorityStack,
body[data-theme="banking"] .priorityItem,
body[data-theme="banking"] .statRibbon article,
body[data-theme="banking"] .compactRows > div,
body[data-theme="banking"] .holidayTabs,
body[data-theme="banking"] .checkCard,
body[data-theme="banking"] .goalModeHero,
body[data-theme="banking"] .goalModeCard,
body[data-theme="banking"] .goalPlannerNoteV38,
body[data-theme="banking"] .deadlineRowV38,
body[data-theme="banking"] .reserveActionCard,
body[data-theme="banking"] .smartActionsV38 article,
body[data-theme="banking"] .deadlineReserveV38,
body[data-theme="banking"] .goalSplitV38,
body[data-theme="banking"] .projectionV38,
body[data-theme="banking"] .projectionV49,
body[data-theme="banking"] .billTileV50,
body[data-theme="banking"] .billBandV50,
body[data-theme="banking"] .billBandHeadV50,
body[data-theme="banking"] .calendarItem,
body[data-theme="banking"] .dateBadge,
body[data-theme="banking"] .insightList > div,
body[data-theme="banking"] .okBox,
body[data-theme="banking"] .subCard,
body[data-theme="banking"] .wishCard,
body[data-theme="banking"] .ruleCard,
body[data-theme="banking"] .healthPulseCard,
body[data-theme="banking"] .healthOkStripV49,
body[data-theme="banking"] .healthWarningStripV49,
body[data-theme="banking"] .healthScoreCardV49,
body[data-theme="banking"] .healthCheckListV49 > div,
body[data-theme="banking"] .healthMiniStatsV49 > div,
body[data-theme="banking"] .trustRulesV49 > div,
body[data-theme="banking"] .movementMonthCardV92,
body[data-theme="banking"] .movementToolbarV92,
body[data-theme="banking"] .movementBreakdownV92 > div,
body[data-theme="banking"] .movementAlertsV92 > div,
body[data-theme="banking"] .movementRowV92,
body[data-theme="banking"] .brandPanel,
body[data-theme="banking"] .controlCard,
body[data-theme="banking"] .toggleCard,
body[data-theme="banking"] .syncFlow,
body[data-theme="banking"] .syncFlow span {
  background:
    radial-gradient(circle at 100% -12%, rgba(55, 230, 192, .10), transparent 18rem),
    linear-gradient(180deg, rgba(17, 31, 55, .94), rgba(7, 14, 27, .96)),
    #0b1628 !important;
  background-color: #0b1628 !important;
  color: var(--text) !important;
  border-color: rgba(151, 178, 214, .24) !important;
  box-shadow: 0 16px 42px rgba(0, 0, 0, .24), inset 0 1px 0 rgba(255, 255, 255, .045) !important;
}

body[data-theme="banking"] .authHero h1,
body[data-theme="banking"] .authCard h2,
body[data-theme="banking"] .pageHero h1,
body[data-theme="banking"] .commandHero h1,
body[data-theme="banking"] .panel h2,
body[data-theme="banking"] .panel h3,
body[data-theme="banking"] .metric strong,
body[data-theme="banking"] .miniCard strong,
body[data-theme="banking"] .goalCard strong,
body[data-theme="banking"] .compactRows strong,
body[data-theme="banking"] .priorityItem strong,
body[data-theme="banking"] .calendarItem strong,
body[data-theme="banking"] .dateBadge strong,
body[data-theme="banking"] .insightList strong,
body[data-theme="banking"] .categoryBars strong,
body[data-theme="banking"] .subCard strong,
body[data-theme="banking"] .wishCard strong,
body[data-theme="banking"] .ruleCard strong,
body[data-theme="banking"] .billTileTopV50 strong,
body[data-theme="banking"] .billBandHeadV50 strong,
body[data-theme="banking"] .controlCard h2,
body[data-theme="banking"] .toggleCard strong {
  color: var(--text) !important;
}

body[data-theme="banking"] .authHero p,
body[data-theme="banking"] .authCard p,
body[data-theme="banking"] .pageHero p,
body[data-theme="banking"] .panelHead small,
body[data-theme="banking"] .metric small,
body[data-theme="banking"] .metric span,
body[data-theme="banking"] .miniCard small,
body[data-theme="banking"] .compactRows span,
body[data-theme="banking"] .compactRows small,
body[data-theme="banking"] .calendarItem small,
body[data-theme="banking"] .dateBadge small,
body[data-theme="banking"] .insightList span,
body[data-theme="banking"] .subCard small,
body[data-theme="banking"] .wishCard small,
body[data-theme="banking"] .ruleCard small,
body[data-theme="banking"] .toggleCard small,
body[data-theme="banking"] .hint,
body[data-theme="banking"] .muted {
  color: var(--muted) !important;
}

body[data-theme="banking"] input,
body[data-theme="banking"] textarea,
body[data-theme="banking"] select,
body[data-theme="banking"] option,
body[data-theme="banking"] .quickAddGridV50 select,
body[data-theme="banking"] .billAddGridV50 select {
  background-image: none !important;
  background-color: #07111f !important;
  color: var(--text) !important;
  border-color: rgba(151, 178, 214, .28) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04) !important;
}

body[data-theme="banking"] input:focus,
body[data-theme="banking"] textarea:focus,
body[data-theme="banking"] select:focus {
  background-color: #0a1628 !important;
  border-color: rgba(55, 230, 192, .64) !important;
  box-shadow: 0 0 0 4px rgba(55, 230, 192, .10), inset 0 1px 0 rgba(255, 255, 255, .05) !important;
}

body[data-theme="banking"] input::placeholder,
body[data-theme="banking"] textarea::placeholder {
  color: #71829e !important;
}

body[data-theme="banking"] .status.good,
body[data-theme="banking"] .pill.good {
  background: rgba(92, 240, 178, .12) !important;
  border-color: rgba(92, 240, 178, .36) !important;
  color: #bfffe7 !important;
}

body[data-theme="banking"] .message.error,
body[data-theme="banking"] .insightList > div.bad,
body[data-theme="banking"] .deadlineRowV38.late,
body[data-theme="banking"] .healthWarningStripV49,
body[data-theme="banking"] .movementAlertsV92 > div.warn,
body[data-theme="banking"] .movementRowV92.warn {
  background:
    radial-gradient(circle at 100% -12%, rgba(255, 107, 134, .12), transparent 18rem),
    linear-gradient(180deg, rgba(45, 20, 38, .92), rgba(12, 13, 25, .96)),
    #160f13 !important;
  border-color: rgba(255, 107, 134, .32) !important;
}

body[data-theme="banking"] .insightList > div.warn,
body[data-theme="banking"] .statRibbon article.warn {
  background:
    radial-gradient(circle at 100% -12%, rgba(255, 209, 102, .13), transparent 18rem),
    linear-gradient(180deg, rgba(49, 37, 18, .86), rgba(13, 16, 25, .94)),
    #160f13 !important;
  border-color: rgba(255, 209, 102, .30) !important;
}

body[data-theme="banking"] .insightList > div.good,
body[data-theme="banking"] .deadlineRowV38.ok,
body[data-theme="banking"] .healthOkStripV49,
body[data-theme="banking"] .movementAlertsV92 > div.good,
body[data-theme="banking"] .movementRowV92.good {
  background:
    radial-gradient(circle at 100% -12%, rgba(92, 240, 178, .14), transparent 18rem),
    linear-gradient(180deg, rgba(16, 45, 50, .92), rgba(7, 18, 27, .96)),
    #071b1f !important;
  border-color: rgba(92, 240, 178, .34) !important;
}

@media (max-width: 1180px) {
  .appShell {
    width: min(100% - 1rem, 1180px);
    grid-template-columns: 1fr;
  }

  .desktopNav {
    position: sticky;
    top: 4.8rem;
    z-index: 14;
    max-height: none;
    overflow: visible;
    padding: .6rem;
  }

  .desktopNavHead,
  .desktopNavFoot {
    display: none;
  }

  .sideTabs {
    display: flex;
    overflow-x: auto;
    gap: .4rem;
    scrollbar-width: thin;
  }

  .sideTabs a {
    min-width: max-content;
  }

  .sideTabs a:hover {
    transform: none;
  }
}

@media (max-width: 640px) {
  .appShell {
    width: calc(100% - .8rem);
    padding-top: .75rem;
  }

  .desktopNav {
    top: 6.9rem;
    border-radius: 20px;
  }

  .sideTabs a {
    padding: .62rem .7rem;
  }
}

/* v100 — Activity table colour correction.
   Keep the banking-dark transaction list dark and calm: rows should read like
   a bank ledger, not a warning screen. */
body[data-theme="banking"] .tableWrap {
  background:
    linear-gradient(180deg, rgba(5, 12, 24, .94), rgba(3, 8, 18, .98)),
    #050914 !important;
  border-color: rgba(151, 178, 214, .18) !important;
}

body[data-theme="banking"] .activityTable {
  border-collapse: separate !important;
  border-spacing: 0 .52rem !important;
  background: transparent !important;
}

body[data-theme="banking"] .activityTable thead th {
  color: #8fa1bd !important;
  background: transparent !important;
  border-bottom: 1px solid rgba(151, 178, 214, .12) !important;
}

body[data-theme="banking"] .activityTable tbody tr.txRow td {
  background:
    linear-gradient(180deg, rgba(18, 28, 48, .96), rgba(12, 20, 36, .98)),
    #0c1424 !important;
  border-top-color: rgba(151, 178, 214, .12) !important;
  border-bottom-color: rgba(151, 178, 214, .12) !important;
  color: #dce8ff !important;
}

body[data-theme="banking"] .activityTable tbody tr.txRow td:first-child {
  border-left-width: 4px !important;
}

body[data-theme="banking"] .activityTable tbody tr.txRow td:last-child {
  border-right-color: rgba(151, 178, 214, .12) !important;
}

body[data-theme="banking"] .activityTable .txRow.expense td {
  background:
    linear-gradient(90deg, rgba(255, 107, 134, .075), rgba(255, 107, 134, .018) 22rem),
    linear-gradient(180deg, rgba(18, 28, 48, .96), rgba(12, 20, 36, .98)),
    #0c1424 !important;
  border-top-color: rgba(255, 107, 134, .16) !important;
  border-bottom-color: rgba(151, 178, 214, .12) !important;
}

body[data-theme="banking"] .activityTable .txRow.expense td:first-child {
  border-left-color: #fb7185 !important;
}

body[data-theme="banking"] .activityTable .txRow.expense td:last-child {
  border-right-color: rgba(255, 107, 134, .16) !important;
}

body[data-theme="banking"] .activityTable .txRow.income td {
  background:
    linear-gradient(90deg, rgba(92, 240, 178, .085), rgba(92, 240, 178, .02) 22rem),
    linear-gradient(180deg, rgba(15, 38, 43, .96), rgba(10, 24, 32, .98)),
    #081a20 !important;
  border-top-color: rgba(92, 240, 178, .18) !important;
  border-bottom-color: rgba(151, 178, 214, .12) !important;
}

body[data-theme="banking"] .activityTable .txRow.income td:first-child {
  border-left-color: #5cf0b2 !important;
}

body[data-theme="banking"] .activityTable .txRow.income td:last-child {
  border-right-color: rgba(92, 240, 178, .18) !important;
}

body[data-theme="banking"] .activityTable .txRow.transfer td,
body[data-theme="banking"] .futureActivityTableV76 .futureForecastRowV76 td {
  background:
    linear-gradient(90deg, rgba(109, 141, 255, .08), rgba(109, 141, 255, .02) 22rem),
    linear-gradient(180deg, rgba(18, 28, 48, .96), rgba(12, 20, 36, .98)),
    #0c1424 !important;
  border-top-color: rgba(109, 141, 255, .16) !important;
  border-bottom-color: rgba(151, 178, 214, .12) !important;
}

body[data-theme="banking"] .activityTable .txRow.transfer td:first-child,
body[data-theme="banking"] .futureActivityTableV76 .futureForecastRowV76 td:first-child {
  border-left-color: #6d8dff !important;
}

body[data-theme="banking"] .right.out {
  color: #ff7a96 !important;
  font-weight: 950 !important;
}

body[data-theme="banking"] .right.in,
body[data-theme="banking"] .runningSpareV76.good {
  color: #65f2b7 !important;
  font-weight: 950 !important;
}

body[data-theme="banking"] .right.transfer {
  color: #93b4ff !important;
  font-weight: 950 !important;
}

body[data-theme="banking"] .txRow .txKind {
  color: #cbd7eb !important;
  background: rgba(255, 255, 255, .07) !important;
  border: 1px solid rgba(151, 178, 214, .18) !important;
}

body[data-theme="banking"] .txRow.expense .txKind {
  color: #ffd6df !important;
  background: rgba(255, 107, 134, .12) !important;
  border-color: rgba(255, 107, 134, .22) !important;
}

body[data-theme="banking"] .txRow.income .txKind {
  color: #c6ffe9 !important;
  background: rgba(92, 240, 178, .12) !important;
  border-color: rgba(92, 240, 178, .22) !important;
}

body[data-theme="banking"] .categoryPill {
  background: rgba(7, 17, 31, .88) !important;
  color: #dce8ff !important;
  border-color: rgba(151, 178, 214, .24) !important;
}

body[data-theme="banking"] .txActions .miniButton {
  background: rgba(255, 255, 255, .08) !important;
  color: #e9f2ff !important;
  border-color: rgba(151, 178, 214, .24) !important;
  box-shadow: none !important;
}

body[data-theme="banking"] .txActions .miniButton:hover {
  background: rgba(109, 141, 255, .16) !important;
  border-color: rgba(109, 141, 255, .36) !important;
}

body[data-theme="banking"] .txActions .miniButton.danger {
  background: rgba(255, 107, 134, .10) !important;
  color: #ffd6df !important;
  border-color: rgba(255, 107, 134, .26) !important;
}

body[data-theme="banking"] .txActions .miniButton.danger:hover {
  background: rgba(255, 107, 134, .16) !important;
  border-color: rgba(255, 107, 134, .38) !important;
}

/* v101 — Money Movement bars match Activity table.
   Scheduled/open rows now use the same calm navy base with only the left
   accent bar carrying the income/expense colour. */
body[data-theme="banking"] .movementRowsV92,
body[data-theme="banking"] .movementAlertsV92 {
  gap: .52rem !important;
}

body[data-theme="banking"] .movementRowV92,
body[data-theme="banking"] .movementAlertsV92 > div {
  position: relative;
  overflow: hidden;
  border-left: 4px solid rgba(151, 178, 214, .34) !important;
  background:
    linear-gradient(180deg, rgba(18, 28, 48, .96), rgba(12, 20, 36, .98)),
    #0c1424 !important;
  border-top-color: rgba(151, 178, 214, .12) !important;
  border-right-color: rgba(151, 178, 214, .12) !important;
  border-bottom-color: rgba(151, 178, 214, .12) !important;
  box-shadow: 0 12px 30px rgba(0, 0, 0, .18), inset 0 1px 0 rgba(255, 255, 255, .035) !important;
}

body[data-theme="banking"] .movementRowV92.warn,
body[data-theme="banking"] .movementRowV92.bad {
  border-left-color: #fb7185 !important;
  background:
    linear-gradient(90deg, rgba(255, 107, 134, .075), rgba(255, 107, 134, .018) 22rem),
    linear-gradient(180deg, rgba(18, 28, 48, .96), rgba(12, 20, 36, .98)),
    #0c1424 !important;
}

body[data-theme="banking"] .movementRowV92.good,
body[data-theme="banking"] .movementAlertsV92 > div.good {
  border-left-color: #5cf0b2 !important;
  background:
    linear-gradient(90deg, rgba(92, 240, 178, .085), rgba(92, 240, 178, .02) 22rem),
    linear-gradient(180deg, rgba(15, 38, 43, .96), rgba(10, 24, 32, .98)),
    #081a20 !important;
}

body[data-theme="banking"] .movementAlertsV92 > div:not(.good) {
  border-left-color: #fb7185 !important;
  background:
    linear-gradient(90deg, rgba(255, 107, 134, .075), rgba(255, 107, 134, .018) 22rem),
    linear-gradient(180deg, rgba(18, 28, 48, .96), rgba(12, 20, 36, .98)),
    #0c1424 !important;
}

body[data-theme="banking"] .movementRowV92.good b,
body[data-theme="banking"] .movementAlertsV92 > div.good b {
  color: #65f2b7 !important;
}

body[data-theme="banking"] .movementRowV92.warn b,
body[data-theme="banking"] .movementRowV92.bad b,
body[data-theme="banking"] .movementAlertsV92 > div:not(.good) b {
  color: #ff7a96 !important;
}

body[data-theme="banking"] .movementRowV92 strong,
body[data-theme="banking"] .movementAlertsV92 strong {
  color: #e9f2ff !important;
}

body[data-theme="banking"] .movementRowV92 span,
body[data-theme="banking"] .movementAlertsV92 span {
  color: #9badc9 !important;
}

/* v114 — Dashboard nice-touch pass: money story, change audit, expandable review drawer. */
.moneyStoryPanelV114,
.dashboardPolishGridV114 .panel {
  animation: cbFadeUpV50 .36s ease both;
}

.moneyStoryPanelV114 {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: minmax(320px, .8fr) minmax(0, 1.2fr);
  gap: 1rem;
  padding: 1.25rem;
  border-radius: 28px;
  border: 1px solid rgba(20, 184, 166, .22);
  background:
    radial-gradient(circle at 92% 10%, rgba(20, 184, 166, .22), transparent 17rem),
    radial-gradient(circle at 12% 110%, rgba(99, 102, 241, .16), transparent 18rem),
    rgba(255, 255, 255, .92);
  box-shadow: 0 22px 58px rgba(15, 23, 42, .08);
}

.moneyStoryPanelV114::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(110deg, transparent, rgba(255, 255, 255, .34), transparent);
  transform: translateX(-110%);
  animation: storySheenV114 7s ease-in-out infinite;
}

.moneyStoryPanelV114.good { border-left: 6px solid #10b981; }
.moneyStoryPanelV114.bad { border-left: 6px solid #fb7185; }
.moneyStoryPanelV114.steady { border-left: 6px solid #38bdf8; }

.storyCopyV114,
.storyCardRailV114 {
  position: relative;
  z-index: 1;
}

.storyCopyV114 {
  align-self: center;
}

.storyCopyV114 h2 {
  margin: .18rem 0 .45rem;
  color: #0f172a;
  font-size: clamp(1.5rem, 2.8vw, 2.4rem);
  line-height: 1;
  letter-spacing: -.06em;
}

.storyCopyV114 p:not(.eyebrow) {
  margin: 0;
  max-width: 56rem;
  color: #52617a;
  font-weight: 750;
}

.storyCardRailV114 {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .7rem;
}

.storyCardRailV114 article,
.changeItemV114,
.reviewDrawerV114 {
  border: 1px solid rgba(148, 163, 184, .24);
  border-radius: 20px;
  background: rgba(248, 250, 252, .82);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .46);
}

.storyCardRailV114 article {
  padding: .9rem;
  min-height: 7.5rem;
}

.storyCardRailV114 small,
.changeItemV114 small,
.drawerDetailGridV114 small {
  display: block;
  color: #64748b;
  font-size: .72rem;
  font-weight: 950;
}

.storyCardRailV114 strong,
.changeItemV114 strong {
  display: block;
  margin: .28rem 0 .18rem;
  color: #0f172a;
  font-size: clamp(1.18rem, 2vw, 1.65rem);
  line-height: 1.02;
  letter-spacing: -.05em;
}

.storyCardRailV114 span,
.changeItemV114 span,
.storyMiniNoteV114 em {
  color: #64748b;
  font-size: .82rem;
  font-weight: 750;
}

.storyCardRailV114 article.good,
.changeItemV114.good {
  border-color: rgba(16, 185, 129, .34);
  background: linear-gradient(180deg, rgba(236, 253, 245, .94), rgba(255,255,255,.86));
}

.storyCardRailV114 article.warn,
.changeItemV114.warn {
  border-color: rgba(245, 158, 11, .34);
  background: linear-gradient(180deg, rgba(255, 251, 235, .94), rgba(255,255,255,.86));
}

.changeItemV114.bad {
  border-color: rgba(251, 113, 133, .36);
  background: linear-gradient(180deg, rgba(255, 241, 242, .94), rgba(255,255,255,.86));
}

.dashboardPolishGridV114 {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(360px, 1.05fr);
  gap: 1rem;
}

.changeFeedV114 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .72rem;
}

.changeItemV114 {
  position: relative;
  overflow: hidden;
  padding: .95rem;
  border-left: 4px solid rgba(59, 130, 246, .54);
}

.changeItemV114.good { border-left-color: #10b981; }
.changeItemV114.warn { border-left-color: #f59e0b; }
.changeItemV114.bad { border-left-color: #fb7185; }
.changeItemV114.steady { border-left-color: #38bdf8; }

.storyMiniNoteV114 {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: .3rem .7rem;
  align-items: center;
  margin-top: .8rem;
  padding: .78rem .88rem;
  border-radius: 18px;
  background: rgba(15, 23, 42, .045);
}

.storyMiniNoteV114 span {
  color: #64748b;
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.storyMiniNoteV114 strong {
  color: #0f172a;
}

.storyMiniNoteV114 em {
  grid-column: 1 / -1;
  font-style: normal;
}

.reviewDrawerListV114 {
  display: grid;
  gap: .65rem;
}

.reviewDrawerV114 {
  overflow: hidden;
  transition: border-color .18s ease, background .18s ease, transform .18s ease;
}

.reviewDrawerV114[open] {
  transform: translateY(-1px);
  border-color: rgba(20, 184, 166, .44);
}

.reviewDrawerV114 summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: .85rem;
  align-items: center;
  cursor: pointer;
  list-style: none;
  padding: .92rem 1rem;
}

.reviewDrawerV114 summary::-webkit-details-marker {
  display: none;
}

.reviewDrawerV114 summary::before {
  content: "+";
  display: inline-grid;
  place-items: center;
  width: 1.55rem;
  height: 1.55rem;
  margin-right: .55rem;
  float: left;
  border-radius: 999px;
  background: rgba(20, 184, 166, .12);
  color: #0f766e;
  font-weight: 1000;
}

.reviewDrawerV114[open] summary::before {
  content: "–";
}

.reviewDrawerV114 summary strong {
  display: block;
  color: #0f172a;
}

.reviewDrawerV114 summary small {
  display: block;
  margin-top: .18rem;
  color: #64748b;
  font-weight: 750;
}

.reviewDrawerV114 summary b {
  color: #0f172a;
  font-size: 1.02rem;
}

.reviewDrawerV114.income summary b { color: #059669; }
.reviewDrawerV114.expense summary b { color: #e11d48; }
.reviewDrawerV114.goal summary b { color: #2563eb; }

.drawerDetailGridV114 {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .55rem;
  padding: 0 1rem .85rem;
}

.drawerDetailGridV114 > div {
  padding: .65rem .7rem;
  border-radius: 14px;
  background: rgba(255, 255, 255, .64);
  border: 1px solid rgba(148, 163, 184, .18);
}

.drawerDetailGridV114 strong {
  display: block;
  margin-top: .15rem;
  color: #0f172a;
  font-size: .9rem;
}

.reviewDrawerV114 .progressWrap {
  padding: 0 1rem .75rem;
}

.reviewDrawerV114 .miniButton {
  margin: 0 1rem 1rem;
}

@keyframes storySheenV114 {
  0%, 58% { transform: translateX(-115%); opacity: 0; }
  70% { opacity: .7; }
  100% { transform: translateX(115%); opacity: 0; }
}

body[data-theme="banking"] .moneyStoryPanelV114,
body[data-theme="banking"] .whatChangedPanelV114,
body[data-theme="banking"] .reviewDrawerPanelV114 {
  background:
    radial-gradient(circle at 92% -10%, rgba(55, 230, 192, .13), transparent 18rem),
    linear-gradient(180deg, rgba(17, 31, 55, .94), rgba(7, 14, 27, .97)),
    #0b1628 !important;
  border-color: rgba(151, 178, 214, .24) !important;
  box-shadow: 0 20px 54px rgba(0, 0, 0, .28), inset 0 1px 0 rgba(255,255,255,.045) !important;
}

body[data-theme="banking"] .moneyStoryPanelV114.good { border-left-color: #5cf0b2 !important; }
body[data-theme="banking"] .moneyStoryPanelV114.bad { border-left-color: #ff6b86 !important; }
body[data-theme="banking"] .moneyStoryPanelV114.steady { border-left-color: #67e8f9 !important; }

body[data-theme="banking"] .storyCopyV114 h2,
body[data-theme="banking"] .storyCardRailV114 strong,
body[data-theme="banking"] .changeItemV114 strong,
body[data-theme="banking"] .storyMiniNoteV114 strong,
body[data-theme="banking"] .reviewDrawerV114 summary strong,
body[data-theme="banking"] .reviewDrawerV114 summary b,
body[data-theme="banking"] .drawerDetailGridV114 strong {
  color: #f5f9ff !important;
}

body[data-theme="banking"] .storyCopyV114 p:not(.eyebrow),
body[data-theme="banking"] .storyCardRailV114 small,
body[data-theme="banking"] .storyCardRailV114 span,
body[data-theme="banking"] .changeItemV114 small,
body[data-theme="banking"] .changeItemV114 span,
body[data-theme="banking"] .storyMiniNoteV114 span,
body[data-theme="banking"] .storyMiniNoteV114 em,
body[data-theme="banking"] .reviewDrawerV114 summary small,
body[data-theme="banking"] .drawerDetailGridV114 small {
  color: #9badc9 !important;
}

body[data-theme="banking"] .storyCardRailV114 article,
body[data-theme="banking"] .changeItemV114,
body[data-theme="banking"] .reviewDrawerV114,
body[data-theme="banking"] .drawerDetailGridV114 > div,
body[data-theme="banking"] .storyMiniNoteV114 {
  background:
    linear-gradient(180deg, rgba(18, 28, 48, .94), rgba(12, 20, 36, .97)),
    #0c1424 !important;
  border-color: rgba(151, 178, 214, .20) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035) !important;
}

body[data-theme="banking"] .storyCardRailV114 article.good,
body[data-theme="banking"] .changeItemV114.good,
body[data-theme="banking"] .reviewDrawerV114.income {
  background:
    linear-gradient(90deg, rgba(92, 240, 178, .085), rgba(92, 240, 178, .02) 24rem),
    linear-gradient(180deg, rgba(15, 38, 43, .96), rgba(10, 24, 32, .98)),
    #081a20 !important;
  border-color: rgba(92, 240, 178, .30) !important;
}

body[data-theme="banking"] .storyCardRailV114 article.warn,
body[data-theme="banking"] .changeItemV114.warn {
  background:
    linear-gradient(90deg, rgba(255, 209, 102, .09), rgba(255, 209, 102, .02) 24rem),
    linear-gradient(180deg, rgba(49, 37, 18, .86), rgba(13, 16, 25, .94)),
    #160f13 !important;
  border-color: rgba(255, 209, 102, .28) !important;
}

body[data-theme="banking"] .changeItemV114.bad,
body[data-theme="banking"] .reviewDrawerV114.expense {
  background:
    linear-gradient(90deg, rgba(255, 107, 134, .075), rgba(255, 107, 134, .018) 24rem),
    linear-gradient(180deg, rgba(18, 28, 48, .96), rgba(12, 20, 36, .98)),
    #0c1424 !important;
  border-color: rgba(255, 107, 134, .28) !important;
}

body[data-theme="banking"] .reviewDrawerV114.income summary b { color: #65f2b7 !important; }
body[data-theme="banking"] .reviewDrawerV114.expense summary b { color: #ff7a96 !important; }
body[data-theme="banking"] .reviewDrawerV114.goal summary b { color: #8cc7ff !important; }
body[data-theme="banking"] .reviewDrawerV114 summary::before {
  background: rgba(55, 230, 192, .13) !important;
  color: #5cf0b2 !important;
}

@media (max-width: 1280px) {
  .moneyStoryPanelV114,
  .dashboardPolishGridV114 {
    grid-template-columns: 1fr;
  }

  .storyCardRailV114 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .storyCardRailV114,
  .changeFeedV114,
  .drawerDetailGridV114 {
    grid-template-columns: 1fr;
  }

  .reviewDrawerV114 summary {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .moneyStoryPanelV114::before {
    animation: none !important;
  }
}

/* v118 - single Starling savings account allocation */
.starlingSavingsAllocationPanel {
  margin: 18px 0;
}

.starlingAllocationSummary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin: 18px 0;
}

.starlingAllocationSummary > div {
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 16px;
  background: linear-gradient(135deg, rgba(21, 34, 56, .9), rgba(10, 32, 39, .82));
}

.starlingAllocationSummary small,
.starlingAllocationSummary span,
.starlingAllocationRow small,
.starlingAllocationRow span {
  display: block;
  color: var(--muted);
}

.starlingAllocationSummary strong {
  display: block;
  color: var(--text);
  font-size: 1.45rem;
  margin: 4px 0;
}

.starlingAllocationRows {
  display: grid;
  gap: 12px;
}

.starlingAccountPicker {
  display: grid;
  gap: 10px;
  margin: 0 0 18px;
}

.starlingAccountPicker > article {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) minmax(120px, auto) auto;
  gap: 12px;
  align-items: center;
  border: 1px solid rgba(148, 163, 184, .2);
  border-radius: 16px;
  padding: 13px 14px;
  background: rgba(15, 23, 42, .72);
}

.starlingAccountPicker > article.selected {
  border-color: rgba(92, 240, 178, .42);
  background: linear-gradient(90deg, rgba(13, 66, 61, .72), rgba(15, 23, 42, .72));
}

.starlingAccountPicker strong,
.starlingAccountPicker span {
  display: block;
}

.starlingAccountPicker span {
  color: var(--muted);
}

.starlingAccountPicker b {
  color: var(--good);
  font-size: 1.05rem;
}

.starlingAccountPicker b.warnText,
.warningText {
  color: #ffd166;
}

.warningText {
  margin: 4px 0 16px;
  font-weight: 800;
}

.starlingAllocationRow {
  display: grid;
  grid-template-columns: minmax(240px, 1.35fr) repeat(3, minmax(120px, .55fr)) minmax(120px, .45fr);
  gap: 14px;
  align-items: center;
  border: 1px solid rgba(148, 163, 184, .22);
  border-radius: 18px;
  padding: 16px;
  background: linear-gradient(90deg, rgba(21, 30, 50, .96), rgba(20, 27, 45, .86));
  overflow: hidden;
}

.starlingAllocationRow.covered {
  border-color: rgba(92, 240, 178, .38);
  background: linear-gradient(90deg, rgba(13, 66, 61, .9), rgba(20, 60, 55, .72));
}

.starlingAllocationRow.partial {
  border-color: rgba(94, 234, 212, .28);
}

.starlingAllocationRow.waiting {
  border-color: rgba(255, 95, 124, .26);
}

.starlingAllocationRow h3 {
  margin: 0 0 3px;
}

.starlingAllocationRow strong {
  color: var(--text);
  font-size: 1.08rem;
}

.allocationProgress {
  height: 9px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(255, 255, 255, .08);
}

.allocationProgress span {
  display: block;
  height: 100%;
  max-width: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--brand), var(--good));
}

body[data-theme="banking"] .spaceLinkCard span,
body[data-theme="banking"] .spaceLinkCard small,
body[data-theme="banking"] .goalManagerRow span {
  color: var(--muted);
}

body[data-theme="banking"] .spaceLinkCard b {
  color: var(--brand);
}

@media (max-width: 1100px) {
  .starlingAllocationSummary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .starlingAccountPicker > article,
  .starlingAllocationRow {
    grid-template-columns: 1fr 1fr;
  }

  .starlingAllocationRow > div:first-child,
  .starlingAllocationRow .allocationProgress {
    grid-column: 1 / -1;
  }
}

@media (max-width: 640px) {
  .starlingAllocationSummary,
  .starlingAccountPicker > article,
  .starlingAllocationRow {
    grid-template-columns: 1fr;
  }
}
