/* Zadesta Finance Hub — the phone-first home (/finance/app) and the demo welcome page.
   Mobile first; two columns from 900px. Follows the phone's light or dark setting. */


.zfh-app {
	--a-bg: #f6f4ef;
	--a-card: #ffffff;
	--a-ink: #16243a;
	--a-muted: #5f6b7d;
	--a-line: #ebe5da;
	--a-navy: var(--zb-main);
	--a-navy-deep: var(--zb-main-deep);
	--a-gold: var(--zb-accent);
	--a-gold-ink: var(--zb-accent-deep);
	--a-in: #1f7a52;
	--a-out: #b3452b;
	--a-shadow: 0 1px 2px rgba(18, 40, 79, .05), 0 8px 24px rgba(18, 40, 79, .06);
	margin: 0; min-height: 100vh; min-height: 100dvh;
	background: var(--a-bg); color: var(--a-ink);
	font: 16px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
	-webkit-font-smoothing: antialiased; -webkit-text-size-adjust: 100%;
	padding-bottom: calc(var(--zu-tab-h) + env(safe-area-inset-bottom, 0px) + 12px);
	overscroll-behavior-y: contain;
}
.zfh-app *, .zfh-app *::before, .zfh-app *::after { box-sizing: border-box; }
.zfh-app a { color: inherit; }
.zfh-app button { font: inherit; color: inherit; }
.zfh-app h1, .zfh-app h2 { margin: 0; }

/* Top bar */
.zfh-top {
	position: sticky; top: 0; z-index: 50;
	display: flex; align-items: center; gap: 12px;
	padding: calc(env(safe-area-inset-top, 0px) + 8px) 12px 8px 16px;
	background: var(--a-navy); color: #fff;
	box-shadow: 0 2px 14px rgba(10, 22, 44, .18);
}
.zfh-top-brand { display: flex; align-items: center; gap: 10px; text-decoration: none; color: #fff !important; min-height: 44px; }
.zfh-top-brand img { width: 34px; height: 34px; object-fit: contain; }
.zfh-top-brand span { font: 700 21px/1 Georgia, serif; letter-spacing: .2px; }
.zfh-top-brand em { font: 700 11px/1 sans-serif; font-style: normal; text-transform: uppercase; letter-spacing: 1px; color: var(--a-navy-deep); background: var(--zb-accent-bright); border-radius: 6px; padding: 4px 6px; vertical-align: 3px; margin-left: 4px; }
.zfh-top-links { display: none; }
.zfh-top-tools { margin-left: auto; display: flex; align-items: center; gap: 6px; }
.zfh-icon-btn, .zfh-avatar-btn {
	position: relative; width: 48px; height: 48px; border-radius: 50%; border: 0; background: transparent; color: #fff;
	display: grid; place-items: center; cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.zfh-icon-btn:active, .zfh-avatar-btn:active { background: rgba(255, 255, 255, .14); }
.zfh-icon-btn svg { width: 26px; height: 26px; }
.zfh-dot {
	position: absolute; top: 5px; right: 4px; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 10px;
	background: #e2583e; color: #fff; font: 700 12px/20px sans-serif; text-align: center; border: 2px solid var(--a-navy);
}
.zfh-avatar-btn .zfh-avatar { width: 38px; height: 38px; font-size: 14px; }

/* Search */
.zfh-top-search { position: relative; }
.zfh-top-search.open .zfh-icon-btn { background: rgba(255, 255, 255, .14); }
.zfh-search-panel {
	position: absolute; left: 0; top: calc(100% + 8px); width: min(92vw, 360px);
	background: #fff; border: 1px solid #D5DCE8; border-radius: 12px; box-shadow: 0 18px 45px rgba(15, 30, 60, .2);
	overflow: hidden; z-index: 60;
}
.zfh-search-box { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-bottom: 1px solid var(--a-line, #ebe5da); color: var(--a-muted, #5f6b7d); }
.zfh-search-box svg { width: 20px; height: 20px; flex-shrink: 0; }
.zfh-search-box input { flex: 1; border: 0; background: transparent; font-size: 16px; min-height: 26px; padding: 0; color: var(--a-ink, #16243a); }
.zfh-search-box input:focus { outline: none; }
.zfh-search-results { list-style: none; margin: 0; padding: 6px; max-height: 60vh; overflow: auto; }
.zfh-search-results li + li { margin-top: 2px; }
.zfh-search-results a { display: flex; flex-direction: column; gap: 1px; padding: 9px 10px; border-radius: 9px; color: #14213d; text-decoration: none; font-weight: 600; font-size: 14.5px; }
.zfh-search-results a:hover, .zfh-search-results a:focus { background: #EEF2FF; color: #14213d; }
.zfh-search-results a small { color: var(--a-muted, #5f6b7d); font-weight: 500; font-size: 12.5px; }
.zfh-search-empty { padding: 14px 12px; color: var(--a-muted, #5f6b7d); font-size: 14px; }
@media (max-width: 560px) { .zfh-search-panel { position: fixed; left: 12px; right: 12px; top: 64px; width: auto; } }

.zfh-demo-strip {
	display: flex; flex-wrap: wrap; gap: 8px 10px; align-items: center; justify-content: center; text-align: center;
	padding: 9px 16px; background: #fbf1cf; color: var(--zb-accent-deep); font-size: 14px; border-bottom: 1px solid #efdc9c;
}
.zfh-demo-strip strong { text-transform: uppercase; letter-spacing: .8px; font-size: 12px; }
.zfh-demo-strip .zfh-handback-top { display: inline-flex; order: -1; background: var(--zb-accent-bright, #F4D03F); color: #3a2f0e; border-color: var(--zb-accent-bright, #F4D03F); }
.zfh-demo-strip .zfh-handback-top:hover { background: #e6c22e; }
.zfh-offline { padding: 9px 16px; text-align: center; background: #2b3a55; color: #fff; font-size: 14px; }

/* Layout */
.zfh-main { max-width: 1120px; margin: 0 auto; padding: 18px 16px 8px; }
.zfh-cols { display: grid; gap: 14px; }
.zfh-col { display: grid; gap: 14px; align-content: start; min-width: 0; }
.zfh-hello h1 { font: 700 clamp(25px, 7vw, 32px)/1.15 Georgia, serif; color: var(--a-navy); letter-spacing: -.2px; overflow-wrap: anywhere; }
.zfh-hello p { margin: 4px 0 14px; color: var(--a-muted); font-size: 15px; }

/* Company and period (from Simple View) */
.zfh-pickers { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 0 0 14px; }
.zfh-co select {
	min-height: 46px; max-width: 100%; font: 700 16px/1.2 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; color: var(--a-navy);
	border: 1px solid var(--a-line); border-radius: 12px; background: var(--a-card); padding: 0 34px 0 12px; -webkit-appearance: none; appearance: none;
	background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%);
	background-position: calc(100% - 18px) 55%, calc(100% - 12px) 55%; background-size: 6px 6px; background-repeat: no-repeat;
}
.zfh-periods { display: inline-flex; background: var(--a-card); border: 1px solid var(--a-line); border-radius: 12px; padding: 3px; }
.zfh-periods button { min-height: 40px; min-width: 64px; padding: 0 10px; border: 0; border-radius: 9px; background: transparent; color: var(--a-muted); font: 700 14px/1 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; cursor: pointer; }
.zfh-periods button[aria-pressed="true"] { background: var(--zb-main); color: #fff; }
@media (max-width: 420px) { .zfh-pickers { display: grid; grid-template-columns: 1fr; } .zfh-periods { display: grid; grid-template-columns: repeat(4, 1fr); } .zfh-periods button { min-width: 0; } }

/* Cash hero */
.zfh-hero {
	position: relative; overflow: hidden; border-radius: 22px; padding: 18px 18px 8px; color: #fff;
	background: radial-gradient(120% 120% at 100% 0%, var(--zb-main-light) 0%, var(--zb-main) 45%, var(--zb-main-deep) 100%);
	box-shadow: 0 16px 36px rgba(18, 40, 79, .25);
}
.zfh-hero::after { content: ""; position: absolute; right: -40px; top: -40px; width: 160px; height: 160px; border-radius: 50%; border: 26px solid rgba(212, 175, 55, .12); pointer-events: none; }
.zfh-hero-top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; position: relative; z-index: 1; }
.zfh-hero h2 { font: 600 15px/1.3 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; color: rgba(255, 255, 255, .82); }
.zfh-seg { display: inline-flex; background: rgba(0, 0, 0, .22); border-radius: 12px; padding: 3px; }
.zfh-seg button {
	min-width: 52px; min-height: 40px; border: 0; border-radius: 10px; background: transparent; color: rgba(255, 255, 255, .8);
	font: 700 14px/1 sans-serif; letter-spacing: .4px; cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.zfh-seg button[aria-checked="true"] { background: var(--zb-accent-bright); color: var(--a-navy-deep); box-shadow: 0 2px 8px rgba(0, 0, 0, .2); }
.zfh-hero-num {
	position: relative; z-index: 1; margin: 12px 0 2px; font: 700 clamp(34px, 11vw, 46px)/1.05 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	letter-spacing: -1px; font-variant-numeric: tabular-nums; color: #fff; overflow-wrap: anywhere;
}
.zfh-hero-note { position: relative; z-index: 1; margin: 2px 0 0; font-size: 13px; color: var(--zb-accent-bright); }
.zfh-ents { list-style: none; margin: 12px 0 0; padding: 0; position: relative; z-index: 1; }
.zfh-ents li { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; padding: 11px 0; border-top: 1px solid rgba(255, 255, 255, .14); font-size: 15px; }
.zfh-ent-name { color: rgba(255, 255, 255, .88); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.zfh-ent-name small { color: var(--zb-accent-bright); font-weight: 700; font-size: 11px; letter-spacing: .6px; margin-left: 4px; }
.zfh-ent-cash { font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }

/* Cards */
.zfh-card { background: var(--a-card); border-radius: 20px; padding: 16px 16px 14px; box-shadow: var(--a-shadow); min-width: 0; }
.zfh-card h2 { font: 700 18px/1.25 Georgia, serif; color: var(--a-navy); margin-bottom: 10px; }
.zfh-card-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.zfh-link { background: none; border: 0; padding: 10px 4px; min-height: 44px; color: var(--a-navy) !important; font-weight: 700 !important; font-size: 15px; text-decoration: none; cursor: pointer; }
.zfh-empty { margin: 4px 0 6px; color: var(--a-muted); font-size: 15px; }

.zfh-trio { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.zfh-trio > div, .zfh-trio > button { background: #f8f6f1; border-radius: 14px; padding: 10px 10px 9px; min-width: 0; border: 0; text-align: left; font: inherit; color: inherit; }
.zfh-trio > button { cursor: pointer; box-shadow: inset 0 0 0 1px rgba(0,0,0,.04); -webkit-tap-highlight-color: transparent; }
.zfh-trio > button:active { transform: scale(.98); }
.zfh-k { display: block; font-size: 13px; color: var(--a-muted); font-weight: 600; }
.zfh-trio strong { display: block; font-size: clamp(15px, 4.3vw, 21px); line-height: 1.25; font-variant-numeric: tabular-nums; letter-spacing: -.4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.zfh-trio strong.is-in { color: var(--a-in); }
.zfh-trio strong.is-out { color: var(--a-out); }
.zfh-trio small { display: block; font-size: 12px; color: var(--a-muted); margin-top: 2px; }
.zfh-trio small.is-good { color: var(--a-in); }
.zfh-trio small.is-bad { color: var(--a-out); }
.zfh-insight { margin: 12px 2px 6px; font-size: 15px; color: #34435c; }
.zfh-spark { height: 118px; margin-top: 6px; }
.zfh-spark svg { width: 100%; height: 100%; display: block; overflow: visible; }
.zfh-legend { display: flex; gap: 16px; font-size: 13px; color: var(--a-muted); margin-top: 4px; }
.zfh-legend span::before { content: ""; display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 6px; vertical-align: -1px; }
.zfh-legend .is-in::before { background: var(--a-in); }
.zfh-legend .is-out::before { background: #e08a74; }
.zfh-legend em { margin-left: auto; font-style: normal; font-size: 12px; }

.zfh-runway h2 { margin-bottom: 2px; }
.zfh-run-num { margin: 0; font: 700 30px/1.2 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; color: var(--a-navy); letter-spacing: -.5px; }
.zfh-run-num small { font-size: 16px; font-weight: 600; color: var(--a-muted); letter-spacing: 0; margin-left: 4px; }
.zfh-run-bar { height: 10px; border-radius: 6px; background: #eeeae2; overflow: hidden; margin: 10px 0 8px; }
.zfh-run-bar span { display: block; height: 100%; width: 0; border-radius: 6px; background: linear-gradient(90deg, #d9482f, #e8b23a 40%, #2e9e5b 75%); transition: width .5s ease; }
.zfh-run-note { margin: 0; font-size: 14px; color: var(--a-muted); }

/* Quick actions */
.zfh-actions { display: grid; grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); gap: 10px; }
.zfh-action, .zfh-app .zfh-action {
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; text-align: center;
	min-height: 84px; padding: 10px 6px; border-radius: 18px; border: 0; cursor: pointer;
	background: var(--a-card); box-shadow: var(--a-shadow); color: var(--a-navy) !important; text-decoration: none;
	font: 700 14px/1.2 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; -webkit-tap-highlight-color: transparent;
}
.zfh-action svg { width: 28px; height: 28px; }
.zfh-action:active { transform: scale(.97); }
.zfh-action.is-gold { background: linear-gradient(135deg, var(--zb-accent), var(--zb-accent-bright)); color: var(--a-navy-deep) !important; }

/* Lists */
.zfh-list { list-style: none; margin: 0; padding: 0; }
.zfh-row {
	display: grid; grid-template-columns: auto 1fr auto; grid-template-areas: "pill title chev" "pill sub chev";
	align-items: center; column-gap: 12px; min-height: 64px; padding: 10px 0; border-top: 1px solid var(--a-line);
	text-decoration: none; color: var(--a-ink) !important; -webkit-tap-highlight-color: transparent;
}
.zfh-list li:first-child .zfh-row { border-top: 0; }
.zfh-row:active { background: #f8f6f1; }
.zfh-row .zfh-pill, .zfh-row .zfh-date { grid-area: pill; }
.zfh-row strong { grid-area: title; font-size: 16px; line-height: 1.3; min-width: 0; overflow-wrap: anywhere; }
.zfh-row small { grid-area: sub; font-size: 13px; color: var(--a-muted); }
.zfh-row svg { grid-area: chev; width: 22px; height: 22px; color: #b3bac6; }
.zfh-pill { display: inline-block; font: 700 11px/1.2 sans-serif; text-transform: uppercase; letter-spacing: .5px; padding: 6px 8px; border-radius: 8px; background: #eef2f8; color: var(--a-navy); max-width: 92px; text-align: center; }
.zfh-row.is-overdue .zfh-pill, .zfh-alist li.is-overdue .zfh-pill { background: #fbe0da; color: #9b2c1d; }
.zfh-row.is-urgent .zfh-pill, .zfh-alist li.is-urgent .zfh-pill { background: #ffe6d6; color: #a2431c; }
.zfh-alist li.is-soon .zfh-pill { background: #fbf1cf; color: var(--zb-accent-deep); }
.zfh-date { display: grid; place-items: center; width: 50px; height: 50px; border-radius: 14px; background: #f3efe6; color: var(--a-muted); font-size: 12px; font-weight: 700; text-transform: uppercase; line-height: 1; }
.zfh-date b { font-size: 20px; color: var(--a-navy); display: block; margin-bottom: 2px; }
.zfh-stamp { text-align: center; color: var(--a-muted); font-size: 13px; margin: 6px 0 4px; }
.zfh-stamp a { color: var(--a-navy); font-weight: 700; display: inline-block; padding: 10px 4px; }

/* Alerts sheet list */
.zfh-alist { list-style: none; margin: 0; padding: 0; }
.zfh-alist li { border-bottom: 1px solid #f0ece4; padding: 12px 4px; }
.zfh-alist li a { display: block; text-decoration: none; color: var(--zu-ink); }
.zfh-alist strong { display: block; font-size: 16px; margin-top: 6px; color: var(--a-navy); }
.zfh-alist small { display: block; font-size: 14px; color: var(--a-muted); margin-top: 2px; }
.zfh-done { margin-top: 10px; min-height: 44px; padding: 0 16px; border-radius: 12px; border: 1px solid #d8d2c6; background: #fff; font-weight: 700 !important; color: var(--a-in) !important; cursor: pointer; }
.zfh-alist li.is-leaving { opacity: 0; transition: opacity .25s; }

/* Pull to refresh */
.zfh-ptr { position: fixed; top: calc(env(safe-area-inset-top, 0px) + 60px); left: 50%; z-index: 60; width: 40px; height: 40px; margin-left: -20px; border-radius: 50%; background: #fff; box-shadow: 0 6px 18px rgba(18, 40, 79, .2); display: grid; place-items: center; opacity: 0; transform: translateY(-50px); pointer-events: none; }
.zfh-ptr span { width: 20px; height: 20px; border-radius: 50%; border: 3px solid #e3dccd; border-top-color: var(--a-navy); }
.zfh-ptr.is-busy span { animation: zfh-spin .7s linear infinite; }
@keyframes zfh-spin { to { transform: rotate(360deg); } }

/* Phones: one column in order of importance (cash, quick actions, what needs you, then the detail). */
@media (max-width: 899px) {
	.zfh-cols { display: flex; flex-direction: column; }
	.zfh-col { display: contents; }
	.zfh-hero { order: 1; }
	.zfh-actions { order: 2; }
	.zfh-needs { order: 3; }
	.zfh-month { order: 4; }
	.zfh-coming { order: 5; }
	.zfh-runway { order: 6; }
	.zfh-stamp { order: 7; }
}
.zfh-hero-cta { position: relative; z-index: 1; display: inline-flex; align-items: center; min-height: 44px; margin: 4px 0 2px; color: var(--zb-accent-bright) !important; font-weight: 700; font-size: 15px; }

/* Wider screens: two columns, links in the top bar, no tab bar */
@media (min-width: 900px) {
	.zfh-app { padding-bottom: 32px; }
	.zfh-top { padding: 10px 24px; }
	.zfh-top-links { display: flex; gap: 2px; margin-left: 18px; overflow: hidden; }
	.zfh-top-links a { padding: 10px 12px; border-radius: 10px; color: rgba(255, 255, 255, .85); text-decoration: none; font-weight: 600; font-size: 15px; white-space: nowrap; }
	.zfh-top-links a:hover { background: rgba(255, 255, 255, .12); color: #fff; }
	.zfh-top-links a[aria-current] { color: var(--zb-accent-bright); box-shadow: inset 0 -3px 0 var(--zb-accent-bright); }
	.zfh-main { padding: 28px 24px 12px; }
	.zfh-cols { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 20px; }
	.zfh-col { gap: 20px; }
	.zfh-card { padding: 20px; }
	.zfh-hero { padding: 24px 24px 10px; }
	.zfh-row:hover { background: #faf8f4; }
}

/* Dark mode */
@media (prefers-color-scheme: dark) {
	.zfh-app { --a-bg: #0b1424; --a-card: #15213a; --a-ink: #e8edf5; --a-muted: #9eabc0; --a-line: #22324f; --a-navy: var(--zb-accent-bright); --a-in: #53c790; --a-out: #f08a70; --a-shadow: 0 1px 2px rgba(0, 0, 0, .3); }
	.zfh-app .zfh-top { background: #0f1c33; }
	.zfh-app .zfh-dot { border-color: #0f1c33; }
	.zfh-app .zfh-trio > div, .zfh-app .zfh-trio > button, .zfh-app .zfh-date { background: #1b2944; }
	.zfh-app .zfh-co select, .zfh-app .zfh-periods { background: #15213a; border-color: #22324f; }
	.zfh-app .zfh-periods button[aria-pressed="true"] { background: var(--zb-accent-bright); color: var(--zb-main-deep); }
	.zfh-app .zfh-insight { color: #c6d0e0; }
	.zfh-app .zfh-run-bar { background: #22324f; }
	.zfh-app .zfh-action { color: var(--zb-accent-bright) !important; }
	.zfh-app .zfh-action.is-gold { color: var(--zb-main-deep) !important; }
	.zfh-app .zfh-row:active, .zfh-app .zfh-row:hover { background: #1b2944; }
	.zfh-app .zfh-pill { background: #22324f; color: #e8edf5; }
	.zfh-app .zfh-rform input, .zfh-app .zfh-rform select { background: #0f1a2e; color: var(--a-ink); border-color: #33466b; }
	.zfh-app .zfh-photo-empty { background: #0f1a2e; border-color: #33466b; color: var(--zb-accent-bright); }
	.zfh-app .zfh-primary { background: var(--zb-accent-bright); color: var(--zb-main-deep) !important; }
	.zfh-app .zfh-done { background: #15213a; border-color: #33466b; }
	.zfh-app .zfh-alist li { border-bottom-color: #22324f; }
	.zfh-app .zfh-alist li a { color: var(--a-ink); }
	.zfh-app .zfh-demo-strip { background: #3a2f0e; color: #f4dc8f; border-bottom-color: #54451a; }
	.zfh-app .zfh-ptr { background: #15213a; }
}

/* Demo welcome page */
.zfh-demo-page {
	margin: 0; min-height: 100vh; min-height: 100dvh; display: grid; place-items: center; padding: 20px 16px;
	padding-top: max(20px, env(safe-area-inset-top)); padding-bottom: max(20px, env(safe-area-inset-bottom));
	background: linear-gradient(150deg, var(--zb-main-deep) 0%, var(--zb-main) 55%, var(--zb-main-light) 100%);
	font: 17px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; color: #16243a;
}
.zfh-demo-box { width: min(460px, 100%); background: #fff; border-radius: 24px; padding: 30px 22px 24px; text-align: center; box-shadow: 0 30px 80px rgba(0, 0, 0, .35); border-top: 6px solid var(--zb-accent); position: relative; }
.zfh-demo-back { display: inline-flex; align-items: center; gap: 6px; font-size: 15px; font-weight: 700; color: var(--a-navy); text-decoration: none; margin: 0 0 10px; }
.zfh-demo-back:hover, .zfh-demo-back:focus-visible { text-decoration: underline; }
.zfh-demo-box img { width: 76px; height: 76px; object-fit: contain; }
.zfh-demo-box h1 { margin: 10px 0 8px; font: 700 clamp(24px, 6.6vw, 30px)/1.2 Georgia, serif; color: var(--zb-main); }
.zfh-demo-lead { margin: 0 0 14px; color: #3d4a60; }
.zfh-demo-points { list-style: none; margin: 0 0 18px; padding: 0; text-align: left; display: grid; gap: 8px; }
.zfh-demo-points li { position: relative; padding-left: 30px; font-size: 15px; color: #34435c; }
.zfh-demo-points li::before { content: ""; position: absolute; left: 4px; top: 5px; width: 14px; height: 8px; border-left: 3px solid #1f7a52; border-bottom: 3px solid #1f7a52; transform: rotate(-45deg); }
.zfh-demo-form { display: grid; gap: 10px; text-align: left; }
.zfh-demo-form label { font-weight: 700; color: var(--zb-main); }
.zfh-demo-form input[name="name"] { min-height: 54px; font-size: 18px; padding: 0 14px; border-radius: 14px; border: 1px solid #cfd6e2; width: 100%; box-sizing: border-box; }
.zfh-demo-form input[name="name"]:focus { outline: none; border-color: var(--zb-accent); box-shadow: 0 0 0 3px rgba(212, 175, 55, .3); }
.zfh-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }
.zfh-demo-err { background: #fdecea; color: #9b2c1d; border-radius: 12px; padding: 10px 12px; font-size: 15px; }
.zfh-demo-ok { background: #ecf8f1; color: #1f6b3e; border-radius: 12px; padding: 10px 12px; font-size: 15px; }

/* 2.0: Personal / Business switch */
.zfh-switch{display:none;align-items:center;padding:7px 12px;border-radius:999px;border:1.5px solid rgba(255,255,255,.45);color:#fff;font-weight:700;font-size:13px;text-decoration:none;white-space:nowrap}
@media (min-width:900px){.zfh-switch{display:inline-flex}}
.zfh-top-sub{font-size:.7em;font-weight:600;opacity:.85;margin-left:2px}

/* 2.0: one-time "now RUE Business" note */
.zfh-rue-note{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;background:#EEF2FF;border:1px solid #C7D2FE;color:#1E3A8A;border-radius:12px;padding:12px 14px;margin:10px 12px;font-size:14px;line-height:1.45}
.zfh-rue-note p{margin:0;flex:1;min-width:220px}
.zfh-rue-note form{margin:0}
.zfh-rue-note button{background:#1E3A8A;color:#fff;border:0;border-radius:10px;padding:9px 14px;font-weight:700;cursor:pointer;min-height:40px}

/* 2.1: company menu with products under each legal company */
.zfh-co-menu { position: relative; }
.zfh-co-btn {
	min-height: 46px; max-width: 100%; display: inline-flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 1px;
	font: 700 16px/1.2 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; color: var(--a-navy); text-align: left;
	border: 1px solid var(--a-line); border-radius: 12px; background: var(--a-card); padding: 6px 38px 6px 12px; cursor: pointer; position: relative;
}
.zfh-co-btn::after { content: ""; position: absolute; right: 14px; top: 50%; width: 7px; height: 7px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: translateY(-70%) rotate(45deg); }
.zfh-co-btn[aria-expanded="true"]::after { transform: translateY(-30%) rotate(-135deg); }
.zfh-co-btn small { font-size: 12px; font-weight: 600; color: var(--a-muted); }
.zfh-co-panel { position: absolute; z-index: 40; top: calc(100% + 6px); left: 0; min-width: 280px; max-width: min(92vw, 380px); background: var(--a-card); border: 1px solid var(--a-line); border-radius: 14px; box-shadow: 0 18px 40px rgba(15, 23, 42, .18); padding: 6px; }
.zfh-co-opt { display: flex; align-items: center; gap: 6px; flex: 1; min-height: 44px; padding: 8px 12px; border-radius: 10px; color: var(--a-navy); font-weight: 600; font-size: 15px; text-decoration: none; }
.zfh-co-opt small { color: var(--a-muted); font-size: 11px; font-weight: 700; }
.zfh-co-opt:hover, .zfh-co-opt:focus-visible { background: rgba(30, 58, 138, .07); }
.zfh-co-opt.is-on { background: var(--zb-main); color: #fff; }
.zfh-co-opt.is-on small { color: rgba(255, 255, 255, .8); }
.zfh-co-row { display: flex; align-items: center; gap: 4px; }
.zfh-co-arrow { flex-shrink: 0; width: 44px; height: 44px; border: 0; border-radius: 10px; background: transparent; color: var(--a-navy); cursor: pointer; display: flex; align-items: center; justify-content: center; }
.zfh-co-arrow:hover { background: rgba(30, 58, 138, .07); }
.zfh-co-arrow svg { transition: transform .15s; }
.zfh-co-arrow[aria-expanded="true"] svg { transform: rotate(90deg); }
.zfh-co-sub { margin: 0 0 4px 16px; padding-left: 8px; border-left: 2px solid var(--a-line); }
.zfh-co-sub .zfh-co-opt { font-weight: 500; font-size: 14px; min-height: 40px; }
@media (max-width: 420px) { .zfh-co-btn { width: 100%; } .zfh-co-panel { right: 0; min-width: 0; max-width: none; } }
@media (prefers-color-scheme: dark) { .zfh-app .zfh-co-btn, .zfh-app .zfh-co-panel { background: #15213a; border-color: #22324f; } .zfh-app .zfh-co-opt:not(.is-on), .zfh-app .zfh-co-arrow, .zfh-app .zfh-co-btn { color: #e6ecf7; } }

/* 2.2: RUE wordmark in the top bar */
.zfh-top-brand > span { display: inline-flex; align-items: flex-end; gap: 8px; }
.zfh-top-brand .rue-wordmark { height: 24px; width: auto; display: block; }

/* 2.6: every page of the chosen view in a row under the top bar (wraps on smaller computers) */
.zfh-top-row { display: none; }
.zfh-top-gap { flex: 1; }
@media (min-width: 900px) {
	.zfh-top-row { display: flex; flex-wrap: wrap; gap: 4px; padding: 6px 24px 10px; background: var(--zb-main, #1E3A8A); position: relative; z-index: 30; }
	.zfh-top-row a, .zfh-top-more summary { padding: 8px 12px; border-radius: 9px; color: rgba(255, 255, 255, .86); text-decoration: none; font-weight: 600; font-size: 14.5px; white-space: nowrap; cursor: pointer; list-style: none; }
	.zfh-top-more summary::-webkit-details-marker { display: none; }
	.zfh-top-row a:hover, .zfh-top-more summary:hover { background: rgba(255, 255, 255, .12); color: #fff; }
	.zfh-top-row > a[aria-current] { color: var(--zb-accent-bright); box-shadow: inset 0 -3px 0 var(--zb-accent-bright); }
	.zfh-top-more { position: relative; }
	.zfh-top-more > div { position: absolute; top: calc(100% + 6px); left: 0; min-width: 230px; display: grid; background: #fff; border: 1px solid #D5DCE8; border-radius: 12px; padding: 6px; box-shadow: 0 18px 45px rgba(15, 30, 60, .2); }
	.zfh-top-more > div a { color: #14213d; }
	.zfh-top-more > div a:hover { background: #EEF2FF; color: #14213d; }
}

/* 2.6: "What would you like to view?" on Business Home */
.zfh-role-modal{position:fixed;inset:0;background:rgba(12,24,48,.78);backdrop-filter:blur(3px);z-index:100005;display:grid;place-items:center;padding:18px;overflow:auto}
.zfh-role-modal[hidden]{display:none!important}
.zfh-role-box{background:#fff;border-radius:18px;padding:28px;width:min(760px,100%);box-shadow:0 30px 90px rgba(0,0,0,.28);text-align:center;border-top:5px solid var(--zb-accent,#d4af37)}
.zfh-role-logo{display:block;margin:0 auto 10px;width:64px;height:64px}
.zfh-role-box h2{font:500 26px/1.2 Georgia,serif;color:var(--zb-main,#1E3A8A);margin:0 0 6px}
.zfh-role-box>p{font-size:16px;color:#4c5667;margin:0}
.zfh-role-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:20px;text-align:left}
.zfh-role-grid button{position:relative;background:#fff;border:1px solid #e3ded3;border-radius:13px;padding:18px;cursor:pointer;font:inherit;color:inherit}
.zfh-role-grid button:hover,.zfh-role-grid button.is-last{border-color:var(--zb-accent,#d4af37)}
.zfh-role-grid strong,.zfh-role-grid small{display:block}.zfh-role-grid strong{color:var(--zb-main,#1E3A8A);font-size:18px}.zfh-role-grid small{color:#6d7787;margin-top:6px;font-size:14px}
.zfh-role-grid button[data-role="guest"]{border-style:dashed}
.zfh-role-grid button em{position:absolute;top:10px;right:12px;font-style:normal;font-size:12px;font-weight:700;color:#8a6d12;background:#fbf1cf;border-radius:10px;padding:2px 8px}
.zfh-role-grid button.is-chosen{background:#fffbeb;box-shadow:0 0 0 3px rgba(212,175,55,.35)}
.zfh-role-remember{display:flex;gap:8px;align-items:center;justify-content:center;margin-top:16px;font-size:14px;color:#4c5667;cursor:pointer}
@media(max-width:640px){.zfh-role-grid{grid-template-columns:1fr}.zfh-role-box{padding:22px 18px}}

.zfh-inspired{text-align:center;color:#94A3B8;font-size:13px;font-weight:600;padding:28px 16px 18px;letter-spacing:.01em;clear:both}

/* 2.6: every row in its own clearly bordered box (Team, Clients, Reminders, Mileage, Wise review) */
.zfh-person{border:1.5px solid #B8C3D6;border-left:5px solid var(--zfh-navy,#1E3A8A);border-radius:14px;margin:12px 0;background:#fff;box-shadow:0 2px 8px rgba(18,40,79,.06)}
.zfh-person:nth-of-type(even){background:#F4F6FB}
.zfh-person[open]{background:#fff;box-shadow:0 4px 16px rgba(18,40,79,.10)}
.zfh-person[open] summary{border-bottom:1.5px solid #D5DCE8}
.zfh-person .zfh-person-edit{white-space:nowrap}
.zfh-danger-btn{color:#B42318!important;border-color:#F3B8B2!important;background:#FFF5F4!important}
.zfh-danger-btn:hover{background:#FDE7E5!important}
.zfh-boxed>tbody>tr>td,.zfh-boxed>tbody>tr>th{border-top:1.5px solid #C9D2E3!important;border-bottom:1.5px solid #C9D2E3!important}
.zfh-boxed>tbody>tr:nth-child(even)>td{background:#F4F6FB}
.zfh-boxed-list>li,.zfh-boxed-item{border:1.5px solid #B8C3D6;border-radius:12px;padding:12px 14px;margin:10px 0;background:#fff;list-style:none}
.zfh-boxed-list>li:nth-child(even){background:#F4F6FB}

.zfh-captures>.zfh-capture{border:1.5px solid #B8C3D6!important;border-left:5px solid var(--zfh-navy,#1E3A8A)!important;border-radius:14px;margin:12px 0}
.zfh-captures>.zfh-capture:nth-child(even){background:#F4F6FB}

/* 4.0 */
.zfh-alerts-foot-row{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-top:14px;padding-top:12px;border-top:1px solid #EEF1F6}
.zfh-alerts-foot-row a{font-weight:700;color:var(--zb-main,#1E3A8A);text-decoration:none}
.zfh-btn-gold{background:var(--zb-accent,#d4af37);color:#1E3A8A!important;border-radius:999px;padding:10px 16px}
.zfh-btn-plain{background:#fff;color:#1E3A8A!important;border:1.5px solid #1E3A8A;border-radius:999px;padding:9px 16px;font-weight:600}
.zfh-btn-plain:hover{background:#eef3fb}
.zfh-pin-close{position:absolute;top:10px;right:12px;width:32px;height:32px;border:none;background:transparent;color:#6d7787;font-size:26px;line-height:1;cursor:pointer;border-radius:50%}
.zfh-pin-close:hover{background:#eef1f5;color:#1F2937}
.zfh-pin-box{position:relative}
@media (prefers-color-scheme: dark){.zfh-pin-close{color:#9aa7bb}.zfh-pin-close:hover{background:rgba(255,255,255,.08);color:#e6ecf7}}
.zfh-idle .zfh-idle-stay{color:#fff!important;-webkit-text-fill-color:#fff}
.zfh-top-row{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}.zfh-top-row::-webkit-scrollbar{display:none}.zfh-top-row a{white-space:nowrap}

/* 4.0 Home */
.zfh-home-grid{display:grid;gap:16px;margin-bottom:16px}
@media(min-width:900px){.zfh-home-grid.is-two{grid-template-columns:1fr 1fr;align-items:start}}
.zfh-home-grid>section{margin:0}
.zfh-be-co{border-top:1px solid #EEF1F6;padding:14px 0 4px}.zfh-be-co:first-of-type{border-top:0;padding-top:4px}
.zfh-be-name{display:block;font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#6d7787;margin-bottom:4px}
.zfh-be-co strong{display:block;font:600 20px/1.3 Georgia,serif;color:var(--zb-main,#1E3A8A)}
.zfh-be-co.is-good strong{color:#1f7a47}
.zfh-be-co p{margin:6px 0 4px;color:#3b4557}
.zfh-be-co small{color:#6d7787}
.zfh-hero-run{margin-top:14px;padding-top:12px;border-top:1px solid rgba(255,255,255,.15);display:grid;grid-template-columns:auto 1fr;gap:4px 10px;align-items:center}
.zfh-hero-run span{opacity:.8;font-size:13px}.zfh-hero-run b{font-size:18px}.zfh-hero-run b small{font-size:12px;margin-left:4px;opacity:.8}
.zfh-hero-run .zfh-run-bar{grid-column:1/-1;height:6px;border-radius:6px;background:rgba(255,255,255,.18);overflow:hidden}.zfh-hero-run .zfh-run-bar span{display:block;height:100%;background:linear-gradient(90deg,#e2583e,#d4af37,#2e9e5b);opacity:1}
.zfh-hero-run small{grid-column:1/-1;opacity:.75;font-size:12px}
.zfh-style{display:inline-flex;background:#F1F5F9;border-radius:999px;padding:3px}
.zfh-style button{border:0;background:transparent;border-radius:999px;padding:6px 12px;font:700 12px/1 inherit;cursor:pointer;color:#475569}
.zfh-style button[aria-pressed="true"]{background:#fff;color:var(--zb-main,#1E3A8A);box-shadow:0 1px 3px rgba(0,0,0,.12)}
.zfh-axis-cap{margin:8px 0 0;font-size:12px;color:#6d7787}
.zfh-see-details{text-align:center;margin:18px 0 6px}.zfh-see-details a{font-weight:800;color:var(--zb-main,#1E3A8A);text-decoration:none}
/* 4.0: Your course (the five levels) at the bottom of the cash card. */
.zfh-hero-course{display:flex;gap:12px;align-items:center;margin-top:14px;padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.12);border-left:4px solid var(--lc);color:#fff!important;text-decoration:none!important;position:relative;z-index:1}
.zfh-hero-course[hidden]{display:none}
.zfh-hero-course:hover,.zfh-hero-course:focus-visible{background:rgba(255,255,255,.2)}
.zfh-hero-course .rue-compass{display:block;color:var(--lc);flex:none}
.zfh-hero-course>span:last-child{flex:1;min-width:0}
.zfh-hero-course .zfh-k{display:block;font-size:12px;opacity:.8;text-transform:uppercase;letter-spacing:.06em}
.zfh-hero-course b{display:block;font-size:16px;margin:1px 0}
.zfh-hero-course small{display:block;font-size:13.5px;line-height:1.45;opacity:.92}
.zfh-hero-course .zfh-c-tip{margin-top:6px;padding-top:6px;border-top:1px solid rgba(255,255,255,.18);font-weight:600}.zfh-hero-course .zfh-c-tip[hidden]{display:none}
.zfh-hero-course .zfh-k{color:rgba(255,255,255,.8)!important;font-weight:700}

/* 4.0.1: Where am I headed? — the 7-step red, amber and green bar. */
.rue-rag{position:relative;padding-top:24px;margin:12px 0 4px}
.rue-rag-you{position:absolute;top:0;font-size:12px;font-weight:700;line-height:1;white-space:nowrap;color:#0F172A}
.rue-rag-you:after{content:"";position:absolute;left:var(--a,50%);top:15px;margin-left:-5px;border:5px solid transparent;border-top-color:currentColor}
.rue-rag-bar{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}
.rue-rag-bar i{display:block;height:10px;border-radius:5px}
.rue-rag-bar i.off{opacity:.22}
.rue-rag-ends{display:flex;justify-content:space-between;gap:8px;font-size:11.5px;color:#64748B;margin-top:5px}
.zfh-hero-course .rue-rag-you,.rp-hero-course .rue-rag-you{color:#fff}
.zfh-hero-course .rue-rag-ends,.rp-hero-course .rue-rag-ends{color:rgba(255,255,255,.78)}
.zfh-hero-course .rue-rag-bar i.off,.rp-hero-course .rue-rag-bar i.off{opacity:.3}

/* 4.0.1: "Viewing as" in the top bar, like in WordPress (on phones it stays in the account menu). */
.zfh-top-view{display:none;align-items:center;gap:8px;color:#fff;font-size:13px;font-weight:600}
.zfh-top-view select{height:36px;border-radius:10px;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.12);color:#fff;font:600 13.5px/1 inherit;padding:0 30px 0 10px}
.zfh-top-view select option{color:#0F172A}
@media (min-width:900px){.zfh-top-view{display:flex}}

/* ---------- 4.0.2: one header everywhere; "Where am I headed?" first ---------- */
.zfh-headed { display: grid; justify-items: center; gap: 6px; text-align: center; max-width: 820px; margin: 4px auto 18px; padding: 20px 22px 18px; background: #fff; border-radius: 20px; border-top: 6px solid var(--lc, #1E3A8A); box-shadow: 0 6px 24px rgba(15, 30, 60, .08); text-decoration: none; color: #0F172A !important; }
a.zfh-headed:hover { box-shadow: 0 10px 30px rgba(15, 30, 60, .14); }
.zfh-headed .zfh-k { font-size: 13px; font-weight: 700; letter-spacing: .6px; text-transform: uppercase; color: #475569; }
.zfh-headed b { font: 700 26px/1.2 Georgia, serif; color: #0F172A; }
.zfh-headed-msg { font-size: 17px; line-height: 1.45; color: #1F2937; max-width: 640px; }
.zfh-headed-bar { width: 100%; max-width: 560px; }
.zfh-headed .zfh-c-tip { font-size: 15px; color: #7c2d12; background: #FFF7ED; border-radius: 10px; padding: 6px 10px; }
.zfh-headed-basis { font-size: 13px; color: #64748b; }
.zfh-signout-top { display: none; align-items: center; gap: 6px; color: #fff !important; text-decoration: none !important; font-weight: 700; font-size: 14px; padding: 8px 12px; border-radius: 10px; border: 1.5px solid rgba(255, 255, 255, .35); }
.zfh-signout-top svg { width: 18px; height: 18px; }
.zfh-signout-top:hover { background: rgba(255, 255, 255, .12); }
.zfh-handback-top { display: none; align-items: center; padding: 7px 12px; border-radius: 999px; border: 1.5px solid var(--zb-accent-bright, #F4D03F); background: transparent; color: var(--zb-accent-bright, #F4D03F); font-weight: 700; font-size: 13px; cursor: pointer; }
.zfh-me-menu { position: relative; }
.zfh-me-menu > summary { list-style: none; cursor: pointer; }
.zfh-me-menu > summary::-webkit-details-marker { display: none; }
.zfh-me-drop { position: absolute; right: 0; top: calc(100% + 8px); min-width: 230px; display: grid; background: #fff; border: 1px solid #D5DCE8; border-radius: 12px; padding: 6px; box-shadow: 0 18px 45px rgba(15, 30, 60, .2); z-index: 60; }
.zfh-me-drop strong { padding: 8px 12px 6px; color: #0F172A; font-size: 14px; }
.zfh-me-drop a { padding: 10px 12px; border-radius: 9px; color: #14213d; text-decoration: none; font-weight: 600; font-size: 14.5px; }
.zfh-me-drop a:hover, .zfh-me-drop a[aria-current] { background: #EEF2FF; }
.zfh-demo-strip.is-owner { background: #FFF7DD; }
.zfh-hub-main { padding: 0 16px 170px; } /* 4.0.3: room for the tab bar and Ask Rue, so the last lines can be read. */
.zfh-hub-main > .wrap.zfh-wrap { margin: 0 auto; max-width: 1400px; }
.zfh-hub .zfh-wrap { padding-top: 14px; }
body.zfh-hub.zfh-embed .zfh-hub-main { padding: 0; }
@media (min-width: 900px) {
	.zfh-signout-top, .zfh-handback-top { display: inline-flex; }
	.zfh-hub-main { padding: 0 24px 40px; }
}
@media (prefers-color-scheme: dark) { .zfh-app .zfh-headed { background: #15213a; color: #e6ecf7 !important; } .zfh-app .zfh-headed b, .zfh-app .zfh-headed-msg { color: #e6ecf7; } .zfh-app .zfh-headed .rue-rag-you { color: #e6ecf7; } .zfh-app .zfh-headed .rue-rag-ends { color: rgba(230,236,247,.78); } }

/* 4.1: "Do this next" — the single most urgent line from Performance Analytics, right at the top of Home. */
.zfh-next { display: flex; align-items: center; gap: 14px; max-width: 820px; margin: 0 auto 18px; padding: 16px 18px; border-radius: 16px; background: #FDF0ED; border-left: 6px solid #B42318; box-shadow: 0 6px 20px rgba(15, 30, 60, .06); }
.zfh-next-tag { flex: 0 0 auto; font-size: 12px; font-weight: 800; letter-spacing: .4px; text-transform: uppercase; color: #B42318; background: #fff; border-radius: 999px; padding: 6px 12px; }
.zfh-next p { margin: 0; font-size: 15.5px; line-height: 1.45; color: #0F172A; }
.zfh-next.is-warn { background: #FFF7E6; border-left-color: #9a5b10; } .zfh-next.is-warn .zfh-next-tag { color: #9a5b10; }
.zfh-next.is-good { background: #ECF8F1; border-left-color: #1f7a47; } .zfh-next.is-good .zfh-next-tag { color: #1f7a47; }
@media (max-width: 640px) { .zfh-next { flex-direction: column; align-items: flex-start; gap: 8px; } }
@media (prefers-color-scheme: dark) {
	.zfh-app .zfh-next { background: #2a1a18; }
	.zfh-app .zfh-next.is-warn { background: #2a2416; }
	.zfh-app .zfh-next.is-good { background: #152a1e; }
	.zfh-app .zfh-next p { color: #e6ecf7; }
	.zfh-app .zfh-next-tag { background: rgba(255,255,255,.08); }
}
.zfh-demo-legal { font-size: 13px; color: #64748B; text-align: center; margin: 4px 0 0; } .zfh-demo-legal a { color: inherit; text-decoration: underline; }
/* 4.0.2: who to chase today */
.zfh-chase-list li{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.zfh-chase-who{display:flex;flex-direction:column;gap:2px;min-width:0}
.zfh-chase-who small{color:#64748b}
.zfh-chase-act{display:flex;gap:8px;flex-wrap:wrap}
.zfh-chase-act .button{min-height:40px;display:inline-flex;align-items:center}
.zfh-chase-list li.is-done{opacity:.5}
.zfh-chase .zfh-chase-list{padding:0;margin:6px 0 0}
.zfh-chase-act a{display:inline-flex;align-items:center;min-height:40px;padding:0 16px;border-radius:10px;font-weight:700;text-decoration:none;border:1.5px solid #1E3A8A;color:#1E3A8A;background:#fff}
.zfh-chase-act a.zfh-chase-wa{background:#0F766E;border-color:#0F766E;color:#fff}
.zfh-home-grid.is-two>:only-child{grid-column:1/-1}
/* 4.0.3: phones in dark mode. The pages inside the app (Transactions, Clients, Upload statements…)
   are built light, so they stay light; only Home and the header use dark colours. */
@media (prefers-color-scheme: dark) {
	body.zfh-hub .zfh-hub-main { --a-bg: #F4F6FB; --a-card: #fff; --a-ink: #16243a; --a-muted: #5b6475; --a-line: #e3e6ee; --a-navy: #1E3A8A; background: #F4F6FB; color: #16243a; color-scheme: light; }
	body.zfh-hub { background: #F4F6FB; }
	body.zfh-app .zfh-add-choice { background: #1b2944; border-color: #2f4166; color: #F1F5F9; }
	body.zfh-app .zfh-add-choice strong { color: #F8FAFC; }
	body.zfh-app .zfh-add-choice small { color: #C8D2E3; }
	body.zfh-app .zfh-add-choice svg { color: var(--zb-accent-bright, #E8C55A); }
}