/* Public product stories. HTML/SVG stays sharp at every density; no scaled screenshot text. */
.mw {
    --ci-primary: #5a45e6;
    --ci-base-page: #fcfdfd;
    --ci-main-wrapper-background: #f3f6ff;
    --ci-base-text: #0b0f19;
    --ci-dashboard-muted-text: #565973;
    --ci-dashboard-card-border: #d6d0ff;
    --ci-investments-accent: #168052;
    --ci-liabilities-accent: #c63951;
    --ci-bills-accent: #a66615;
    --mw-accent: var(--ci-primary);
    --mw-surface: #fff;
    --mw-border: #e1e4ef;
    --mw-soft: color-mix(in srgb, var(--mw-accent) 7%, var(--mw-surface));
    --mw-text: var(--ci-base-text);
    --mw-muted: var(--ci-dashboard-muted-text);
    --mw-shadow: 0 24px 80px -35px #37305c45;
    color: var(--mw-text);
    background: var(--ci-base-page);
    font-family: "Manrope", system-ui, sans-serif;
}
[data-bs-theme="dark"] .mw {
    --ci-primary: #a091ff;
    --ci-base-page: #0b0f19;
    --ci-main-wrapper-background: #141a29;
    --ci-base-text: #eef0fa;
    --ci-dashboard-muted-text: #afb5ca;
    --ci-dashboard-card-border: #2b3045;
    --ci-investments-accent: #34d399;
    --ci-liabilities-accent: #fb8798;
    --ci-bills-accent: #f2b557;
    --mw-surface: #151c2b;
    --mw-border: #2b3449;
    --mw-shadow: 0 24px 80px -35px #0009;
}
.mw h1, .mw h2, .mw h3, .mw h4 { color: var(--mw-text); }
.mw.nf-theme { --cp-bg: var(--ci-base-page); --cp-surface: var(--mw-surface); --cp-surface-soft: var(--mw-soft); --cp-border: var(--mw-border); --cp-text: var(--mw-text); --cp-text-muted: var(--mw-muted); --cp-accent: var(--ci-primary); }
.mw p { color: var(--mw-muted); }
.mw a { text-decoration: none; }
.mw :is(a, button, summary):focus-visible { outline: 3px solid var(--ci-primary); outline-offset: 5px; }
.mw :is(section[id], h2[id]) { scroll-margin-top: 110px; }
.mw .container { max-width: 1240px; padding-inline: 24px; }
.mw-hero { position: relative; padding: 156px 0 80px; background: radial-gradient(ellipse at 78% 42%, color-mix(in srgb, var(--ci-primary) 8%, transparent), transparent 58%), linear-gradient(180deg, var(--ci-main-wrapper-background), var(--ci-base-page)); }
.mw-hero-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.06fr); align-items: center; gap: clamp(32px, 5vw, 72px); }
.mw-hero-copy { position: relative; z-index: 1; }
.mw-eyebrow { display: inline-flex; align-items: center; gap: 8px; color: var(--ci-primary); font-size: 11px; line-height: 1.7; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; margin-bottom: 22px; }
.mw-eyebrow > i { font-size: 18px; }
.mw-live-dot { width: 7px; height: 7px; background: var(--ci-primary); border-radius: 50%; box-shadow: 0 0 0 5px color-mix(in srgb, var(--ci-primary) 10%, transparent); }
.mw h1 { margin: 0 0 26px; font-size: clamp(42px, 4.9vw, 68px); font-weight: 800; line-height: 1.065; letter-spacing: -.057em; }
.mw-home-overview { padding-block: clamp(64px, 8vw, 110px); margin-top: 32px; border-top: 1px solid var(--mw-border); background: radial-gradient(ellipse at 78% 42%, color-mix(in srgb, var(--ci-primary) 6%, transparent), transparent 58%); }
.mw-overview-title { font-size: clamp(32px, 3.5vw, 50px); font-weight: 800; line-height: 1.12; letter-spacing: -.045em; margin-bottom: 22px; }
.mw-gradient-text { color: var(--ci-primary); background: linear-gradient(120deg, var(--ci-primary), #9384ef); background-clip: text; -webkit-text-fill-color: transparent; }
.mw-gradient-text.is-green { background-image: linear-gradient(120deg, var(--ci-investments-accent), #41ac92); }
.mw-lead { max-width: 520px; font-size: clamp(17px, 1.35vw, 19px); line-height: 1.75; margin: 0; }
.mw-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 24px; margin-top: 32px; }
.mw .btn-primary { background: #5a45e6; border-color: #5a45e6; color: white; }
.mw .btn-primary:hover { background: #4935cf; border-color: #4935cf; }
.mw .btn { border-radius: 12px; font-weight: 700; }
.mw-secondary-action { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; color: var(--mw-text); font-size: 14px; font-weight: 700; }
.mw-reassurance { display: flex; flex-wrap: wrap; gap: 9px 16px; margin-top: 26px; color: var(--mw-muted); font-size: 11px; }
.mw-reassurance span { display: inline-flex; align-items: center; gap: 5px; }
.mw-reassurance i { color: var(--ci-primary); font-size: 15px; }
.mw-hero-art { position: relative; }
.mw-hero-art::before { content: ""; position: absolute; inset: -24px -22px 14px; border: 1px solid color-mix(in srgb, var(--ci-primary) 13%, transparent); border-radius: 36px; transform: rotate(-3deg); background: color-mix(in srgb, var(--ci-primary) 3%, transparent); pointer-events: none; }
.mw-hero-art .mw-demo { position: relative; }
.mw-area-nav { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px 24px; padding-block: 24px; border-block: 1px solid var(--mw-border); }
.mw-area-nav a { display: inline-flex; align-items: center; gap: 8px; color: var(--mw-muted); font-size: 12px; font-weight: 700; padding-block: 9px; min-height: 44px; }
.mw-area-nav a:hover { color: var(--ci-primary); }
.mw-area-nav i { font-size: 18px; }
.mw-story { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(40px, 7vw, 100px); align-items: center; padding-block: clamp(64px, 8vw, 110px); }
.mw-story + .mw-story { border-top: 1px solid var(--mw-border); }
.mw-story.is-reversed .mw-story-copy { order: 2; }
.mw-story h2, .mw-section-heading h2, .mw-platform h2 { margin: 0 0 22px; font-size: clamp(30px, 3.05vw, 44px); font-weight: 800; line-height: 1.15; letter-spacing: -.045em; }
.mw-story-copy > p, .mw-platform p { max-width: 480px; font-size: 16px; line-height: 1.8; margin: 0; }
.mw-story .mw-eyebrow { margin-bottom: 17px; }
.mw-benefits { list-style: none; padding: 0; margin: 24px 0 0; display: grid; gap: 15px; }
.mw-benefits li { display: flex; align-items: start; gap: 12px; color: var(--mw-text); font-size: 13px; font-weight: 600; line-height: 1.6; }
.mw-benefits i { flex: none; color: var(--ci-primary); font-size: 20px; }
.mw-text-link { display: inline-flex; align-items: center; gap: 9px; min-height: 44px; margin-top: 22px; color: var(--ci-primary); font-size: 13px; font-weight: 800; }
.mw-text-link:hover { color: var(--ci-primary); text-decoration: underline; }
.mw-text-link i { font-size: 20px; }
.mw .mw-plan-note { display: block; margin-top: 16px; font-size: 11px; line-height: 1.7; color: var(--mw-muted); }
.mw-green { color: var(--ci-investments-accent); }
.mw-gold { color: var(--ci-bills-accent); }
.mw-rose { color: var(--ci-liabilities-accent); }
.mw-green-band { background: radial-gradient(ellipse at 70% 50%, color-mix(in srgb, var(--ci-investments-accent) 6%, transparent), transparent 60%), color-mix(in srgb, var(--ci-investments-accent) 2%, var(--ci-base-page)); }
.mw-feature-band { border-block: 1px solid var(--mw-border); }
.mw-platform { padding-block: 72px; margin-block: 32px; display: grid; grid-template-columns: 1.2fr 1fr; gap: 64px; align-items: center; }
.mw-platform-icons { display: flex; justify-content: center; align-items: center; }
.mw-platform-icons > i { font-size: 90px; color: var(--ci-primary); padding: 24px; border-radius: 24px; background: var(--mw-soft); }
.mw-platform-connection { width: 64px; height: 2px; background: linear-gradient(90deg, var(--ci-primary), var(--ci-investments-accent)); position: relative; }
.mw-platform-connection::after { content: ""; display: block; width: 9px; height: 9px; border-radius: 50%; background: var(--ci-primary); position: absolute; top: -3px; animation: mw-packet 4s ease-in-out infinite; }
.mw-trust-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; padding-block: 35px 64px; }
.mw-trust-grid a { display: grid; grid-template-columns: auto 1fr; column-gap: 13px; color: var(--mw-text); }
.mw-trust-grid i { grid-row: span 2; font-size: 26px; color: var(--ci-primary); }
.mw-trust-grid b { font-size: 13px; }
.mw-trust-grid span { font-size: 12px; color: var(--mw-muted); margin-top: 4px; }
.mw-cta { text-align: center; padding-block: clamp(70px, 9vw, 120px); border-top: 1px solid var(--mw-border); }
.mw-cta h2 { font-size: clamp(34px, 4vw, 54px); font-weight: 800; line-height: 1.12; letter-spacing: -.045em; margin-bottom: 22px; }
.mw-cta > p { font-size: 15px; line-height: 1.8; }
.mw-store-links { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; margin-top: 28px; }
.mw-store-links a { display: flex; align-items: center; gap: 10px; padding: 11px 22px; min-height: 58px; border: 1px solid var(--mw-border); border-radius: 12px; background: var(--mw-text); color: var(--mw-surface); text-align: left; }
.mw-store-links i { font-size: 28px; }
.mw-store-links span { font-weight: 800; font-size: 17px; line-height: 1.2; }
.mw-store-links small { display: block; font-weight: 500; font-size: 9px; margin-bottom: 3px; }

/* Shared app-scale examples. Animation belongs to the information, not the surrounding page. */
.mw-demo { --mw-accent: var(--ci-primary); --mw-loop: 14s; margin: 0; min-width: 0; width: 100%; border: 1px solid var(--mw-border); border-radius: 20px; background: var(--mw-surface); box-shadow: var(--mw-shadow); color: var(--mw-text); font-size: clamp(12px, .98vw, 14px); line-height: 1.45; }
.mw-demo-body { overflow: hidden; border-radius: 20px 20px 0 0; }
.mw-demo figcaption { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 4px; min-height: 44px; padding: 4px 16px; border-top: 1px solid var(--mw-border); color: var(--mw-muted); font-size: 10px; }
.mw-motion-toggle { display: none; align-items: center; gap: 4px; min-height: 44px; border: 0; padding: 4px 0 4px 10px; background: transparent; color: var(--mw-muted); font-size: 10px; font-weight: 600; }
[data-motion-ready] .mw-motion-toggle { display: inline-flex; }
.mw-motion-toggle i { font-size: 16px; }
.mw-demo small { display: block; color: var(--mw-muted); font-size: .77em; }
.mw-window-bar { display: flex; align-items: center; gap: 10px; min-height: 49px; padding: 12px 18px; border-bottom: 1px solid var(--mw-border); font-size: .8em; color: var(--mw-text); }
.mw-window-bar > i { color: var(--mw-accent); font-size: 20px; }
.mw-window-bar > :last-child:not(:first-child) { margin-left: auto; }
.mw-window-bar .mw-window-subtitle, .mw-window-bar span > b { color: var(--mw-muted); font-weight: 500; }
.mw-window-dots { width: 37px; height: 9px; flex: none; background: radial-gradient(circle at 4px 4px, #dca2b0 3px, transparent 3.5px), radial-gradient(circle at 17px 4px, #ddb77f 3px, transparent 3.5px), radial-gradient(circle at 30px 4px, #82b9ab 3px, transparent 3.5px); }
.mw-demo-padding { padding: clamp(20px, 2.1vw, 30px); }
.mw-label { display: flex; justify-content: space-between; align-items: center; gap: 8px; font-size: .65em; letter-spacing: .07em; font-weight: 800; color: var(--mw-muted); }
.mw-label > span { font-size: 1em; letter-spacing: 0; font-weight: 600; }
.mw-big-number { font-size: clamp(28px, 3vw, 40px); font-weight: 800; line-height: 1.2; letter-spacing: -.035em; margin-top: 8px; }
.mw-trend { display: block; margin-top: 8px; font-size: 11px; line-height: 1.5; letter-spacing: 0; font-weight: 600; color: var(--ci-investments-accent); }
.mw-pill { display: inline-flex; align-items: center; gap: 4px; border-radius: 6px; padding: 4px 7px; background: color-mix(in srgb, var(--mw-accent) 10%, var(--mw-surface)); color: var(--mw-accent); font-size: .75em; line-height: 1.4; font-weight: 700; letter-spacing: 0; white-space: nowrap; }
.mw-chart { display: block; width: 100%; height: auto; margin: 16px 0 0; color: var(--mw-accent); }
.mw-chart-grid { stroke: var(--mw-border); stroke-width: 1; stroke-dasharray: 3 5; }
.mw-chart-area { fill: currentColor; opacity: .09; }
.mw-chart-line { stroke: currentColor; stroke-width: 3; stroke-linecap: round; stroke-dasharray: 100; animation: mw-line var(--mw-loop) ease-in-out infinite; }
.mw-chart-labels { display: flex; justify-content: space-between; gap: 8px; margin-top: 12px; color: var(--mw-muted); font-size: .7em; }
.mw-chart-labels b { color: var(--mw-accent); }
.mw-tone-green { --mw-accent: var(--ci-investments-accent); }
.mw-tone-rose { --mw-accent: var(--ci-liabilities-accent); }
.mw-tone-gold { --mw-accent: var(--ci-bills-accent); }
.mw-avatar-pair { display: inline-flex; padding-left: 5px; }
.mw-avatar-pair span, .mw-avatar { width: 25px; height: 25px; display: inline-grid; place-items: center; background: #dceaff; color: #255caa; border: 2px solid var(--mw-surface); border-radius: 50%; font-size: 10px; font-weight: 800; }
.mw-avatar-pair span + span { margin-left: -5px; background: #fff0d7; color: #95630f; }
.mw-avatar.is-partner { background: #fff0d7; color: #95630f; }
.mw-avatar.is-large { width: 50px; height: 50px; font-size: 18px; }
.mw-dashboard-content { padding: 18px; background: color-mix(in srgb, var(--ci-main-wrapper-background) 65%, var(--mw-surface)); }
.mw-demo-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: .74em; font-weight: 700; margin-bottom: 14px; }
.mw-demo-heading i { color: var(--ci-primary); font-size: 17px; vertical-align: -3px; margin-right: 4px; }
.mw-spend-card { color: #3372bd; padding: 18px 20px 10px; border: 1px solid color-mix(in srgb, #60a5fa 27%, var(--mw-border)); border-radius: 14px; background: linear-gradient(145deg, color-mix(in srgb, #60a5fa 12%, var(--mw-surface)), var(--mw-surface)); }
.mw-spend-card .mw-big-number { color: var(--mw-text); }
.mw-spend-card .mw-chart { --mw-accent: #438ce3; height: 100px; }
.mw-dashboard-tiles { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; }
.mw-small-card { position: relative; overflow: hidden; padding: 14px; border: 1px solid color-mix(in srgb, var(--mw-accent) 24%, var(--mw-border)); border-radius: 12px; background: linear-gradient(145deg, color-mix(in srgb, var(--mw-accent) 8%, var(--mw-surface)), var(--mw-surface)); }
.mw-small-card > span:first-child { display: flex; align-items: center; gap: 5px; font-size: .73em; font-weight: 700; color: var(--mw-accent); }
.mw-small-card b { display: block; font-size: 1.4em; margin-block: 6px; }
.mw-small-card small { font-size: .67em; }
.mw-mini-line { display: block; width: 92%; height: 22px; background: var(--mw-accent); opacity: .5; margin-top: 12px; clip-path: polygon(0 85%, 15% 55%, 25% 65%, 36% 18%, 44% 45%, 59% 30%, 69% 42%, 78% 10%, 86% 20%, 100% 0, 100% 9%, 86% 30%, 78% 20%, 69% 52%, 59% 40%, 44% 55%, 36% 28%, 25% 75%, 15% 65%, 0 95%); }
.mw-payday-card { padding: 15px; border: 1px solid color-mix(in srgb, var(--ci-bills-accent) 20%, var(--mw-border)); border-radius: 12px; background: color-mix(in srgb, var(--ci-bills-accent) 5%, var(--mw-surface)); margin-top: 10px; }
.mw-bill-strip { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 12px; }
.mw-bill-strip span { display: grid; grid-template-columns: auto 1fr; column-gap: 6px; padding: 9px; border-radius: 8px; background: var(--mw-surface); color: var(--mw-muted); font-size: .65em; animation: mw-row var(--mw-loop) ease-in-out infinite; }
.mw-bill-strip span:nth-child(2) { animation-delay: .6s; }.mw-bill-strip span:nth-child(3) { animation-delay: 1.2s; }
.mw-bill-strip i { grid-row: span 2; color: var(--ci-bills-accent); font-size: 17px; }.mw-bill-strip b { color: var(--mw-text); font-size: 1.15em; }
.mw-safe { display: flex; align-items: center; gap: 6px; margin-top: 10px; color: var(--ci-primary); font-size: .68em; font-weight: 700; }
.mw-signal-toast { display: flex; align-items: center; gap: 10px; padding: 13px; border: 1px solid color-mix(in srgb, var(--ci-primary) 22%, var(--mw-border)); border-radius: 11px; background: var(--mw-surface); margin-top: 10px; animation: mw-notice var(--mw-loop) ease-in-out infinite; }
.mw-signal-toast > i { color: var(--ci-primary); font-size: 23px; }.mw-signal-toast b { display: block; font-size: .77em; }.mw-signal-toast div > span { display: block; font-size: .68em; color: var(--mw-muted); }.mw-signal-toast .mw-pill { margin-left: auto; font-size: .6em; }
.mw-timeline { margin-block: 20px; }.mw-timeline-row { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 14px; padding: 13px 0; border-bottom: 1px solid var(--mw-border); animation: mw-row var(--mw-loop) ease-in-out infinite; }.mw-timeline-row:nth-child(2) { animation-delay: .8s; }.mw-timeline-row:nth-child(3) { animation-delay: 1.6s; }.mw-timeline-row:nth-child(4) { animation-delay: 2.4s; }
.mw-date { display: block; min-width: 36px; text-align: center; font-size: .6em; color: var(--mw-accent); padding: 6px; border-radius: 8px; background: var(--mw-soft); }.mw-date b { font-size: 1.8em; }.mw-timeline-row div > b { font-size: .9em; }.mw-timeline-row strong { font-size: .95em; }.mw-timeline-row.is-payday strong { color: var(--ci-investments-accent); }
.mw-answer-strip { display: flex; align-items: center; gap: 12px; border-radius: 10px; padding: 16px; background: var(--mw-soft); margin-top: 16px; }.mw-answer-strip > i { color: var(--mw-accent); font-size: 24px; }.mw-answer-strip b { display: block; font-size: .92em; }.mw-answer-strip small { margin-top: 4px; font-size: .68em; letter-spacing: .01em; }
.mw-merchant { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; margin-bottom: 24px; }.mw-merchant b { font-size: .95em; }.mw-merchant strong { font-size: 1.35em; white-space: nowrap; }.mw-icon-tile { width: 45px; height: 45px; flex: none; display: grid; place-items: center; border-radius: 13px; background: var(--mw-soft); color: var(--mw-accent); font-size: 24px; }
.mw-detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; padding-block: 18px; border-block: 1px solid var(--mw-border); }.mw-detail-grid small { letter-spacing: .05em; font-size: .58em; }.mw-detail-grid b { display: block; margin-top: 6px; font-size: .83em; }
.mw-split-demo { padding-top: 24px; }.mw-split-people { display: flex; justify-content: space-between; margin-top: 18px; }.mw-split-people > span { display: flex; align-items: center; gap: 7px; font-size: .8em; }.mw-split-people b { font-size: 1.25em; margin-left: 5px; }.mw-split-bar { margin-top: 16px; height: 10px; background: #dbad59; border-radius: 8px; overflow: hidden; }.mw-split-bar > span { display: block; height: 100%; width: 60%; background: #438ce3; animation: mw-split var(--mw-loop) ease-in-out infinite; }
.mw-demo-confirmation { text-align: center; font-size: .8em; font-weight: 700; color: var(--mw-accent); border: 1px solid color-mix(in srgb, var(--mw-accent) 25%, var(--mw-border)); padding: 13px; margin-top: 24px; border-radius: 10px; animation: mw-notice var(--mw-loop) ease-in-out infinite; }.mw-demo-confirmation > i { font-size: 19px; vertical-align: -3px; margin-right: 4px; }
.mw-prompt { display: flex; align-items: center; gap: 12px; padding: 16px; border-radius: 12px; background: var(--mw-soft); font-size: .92em; }.mw-prompt i { font-size: 24px; color: var(--mw-accent); animation: mw-think var(--mw-loop) ease-in-out infinite; }
.mw-rule-flow { display: grid; justify-items: center; gap: 10px; margin-top: 20px; }.mw-rule-flow > div { width: 100%; padding: 16px; border: 1px solid var(--mw-border); border-radius: 10px; }.mw-rule-flow small { font-size: .6em; letter-spacing: .08em; color: var(--mw-accent); }.mw-rule-flow b { display: block; font-size: .94em; margin-block: 6px; }.mw-rule-flow div > span { font-size: .8em; color: var(--mw-muted); }.mw-rule-flow > i { font-size: 23px; color: var(--mw-accent); animation: mw-flow var(--mw-loop) ease-in-out infinite; }
.mw-rule-preview { margin-top: 22px; }.mw-rule-preview > div { display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 10px; padding-block: 12px; border-bottom: 1px solid var(--mw-border); font-size: .76em; }.mw-rule-preview .mw-pill { animation: mw-tag var(--mw-loop) ease-in-out infinite; }
.mw-ai-question { display: flex; align-items: center; gap: 12px; justify-content: flex-end; margin-bottom: 22px; }.mw-ai-question > span:last-child { padding: 14px 16px; border-radius: 14px 14px 3px 14px; background: var(--mw-soft); font-size: .9em; font-weight: 600; }
.mw-ai-grounding { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; font-size: .73em; color: var(--mw-accent); margin-bottom: 20px; }.mw-ai-grounding > i { font-size: 19px; }.mw-grounding-dots { margin-left: auto; letter-spacing: .15em; animation: mw-think var(--mw-loop) ease-in-out infinite; }
.mw-ai-answer { padding: 20px; border: 1px solid var(--mw-border); border-radius: 14px; animation: mw-answer var(--mw-loop) ease-in-out infinite; }.mw-ai-answer p { font-size: 1.04em; line-height: 1.8; margin-top: 12px; }.mw-ai-answer p b { color: var(--mw-text); }
.mw-ai-bar { display: grid; grid-template-columns: 75px 1fr 65px; gap: 12px; align-items: center; font-size: .78em; margin-top: 16px; }.mw-ai-bar i { height: 9px; width: var(--bar); background: var(--mw-accent); border-radius: 5px; transform-origin: left; animation: mw-grow var(--mw-loop) ease-in-out infinite; }.mw-ai-bar b { text-align: right; color: var(--mw-text); }.mw-answer-source { display: flex; align-items: center; gap: 6px; font-size: .67em; color: var(--mw-muted); margin-top: 24px; border-top: 1px solid var(--mw-border); padding-top: 12px; }
.mw-ai-followup { display: flex; align-items: center; gap: 8px; margin-top: 20px; font-size: .76em; color: var(--mw-accent); }.mw-ai-followup > i:last-child { margin-left: auto; }
.mw-sharing-route { display: flex; align-items: center; justify-content: center; gap: 14px; padding: 15px 0 30px; }.mw-sharing-route > i { font-size: 42px; color: var(--mw-accent); }.mw-sharing-wire { position: relative; width: 46px; height: 2px; background: var(--mw-border); }.mw-sharing-wire::after { content: ""; position: absolute; width: 7px; height: 7px; top: -2px; border-radius: 50%; background: var(--mw-accent); animation: mw-packet 4s ease-in-out infinite; }
.mw-sharing-row { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; padding: 16px 0; border-top: 1px solid var(--mw-border); }.mw-sharing-row > i { font-size: 24px; color: var(--mw-accent); }.mw-sharing-row b { font-size: .9em; }.mw-sharing-row > span { font-size: .72em; white-space: nowrap; }.mw-sharing-status { color: var(--ci-investments-accent); animation: mw-tag var(--mw-loop) ease-in-out infinite; }.mw-sharing-row.is-private { color: var(--mw-muted); }.mw-sharing-row.is-private > i { color: var(--mw-muted); }
.mw-report-chart { display: flex; align-items: end; justify-content: space-around; height: 165px; gap: 16px; border-bottom: 1px solid var(--mw-border); margin-bottom: 16px; padding-bottom: 6px; }.mw-report-chart > div { height: 100%; width: 20%; display: flex; flex-direction: column; align-items: center; justify-content: end; gap: 12px; }.mw-report-chart i { display: block; height: var(--bar); width: 65%; background: linear-gradient(0deg, color-mix(in srgb, var(--mw-accent) 35%, var(--mw-surface)), var(--mw-accent)); border-radius: 7px 7px 0 0; transform-origin: bottom; animation: mw-grow var(--mw-loop) ease-in-out infinite; }.mw-report-chart div:nth-child(2) i { animation-delay: .3s; }.mw-report-chart div:nth-child(3) i { animation-delay: .6s; }.mw-report-chart div:nth-child(4) i { animation-delay: .9s; }.mw-report-chart span { font-size: .65em; }
.mw-report-row { display: flex; justify-content: space-between; padding: 12px 0; border-bottom: 1px solid var(--mw-border); font-size: .84em; }.mw-export-strip { display: flex; justify-content: end; flex-wrap: wrap; gap: 8px; margin-top: 18px; }.mw-export-strip > span { display: flex; align-items: center; gap: 5px; border: 1px solid var(--mw-border); border-radius: 7px; padding: 8px 12px; font-size: .7em; animation: mw-tag var(--mw-loop) ease-in-out infinite; }.mw-export-strip i { color: var(--mw-accent); font-size: 16px; }
.mw-physical-card { padding: 24px; border-radius: 16px; margin-bottom: 24px; color: var(--mw-text); border: 1px solid color-mix(in srgb, var(--mw-accent) 25%, var(--mw-border)); background: linear-gradient(140deg, color-mix(in srgb, var(--mw-accent) 13%, var(--mw-surface)), var(--mw-surface)); }.mw-physical-card > span { display: flex; justify-content: space-between; font-size: .7em; letter-spacing: .07em; }.mw-physical-card b { display: block; font-size: 2.3em; margin-block: 22px 7px; }.mw-physical-card i { font-size: 24px; }
.mw-meter { position: relative; height: 9px; border-radius: 6px; background: color-mix(in srgb, var(--mw-accent) 10%, var(--mw-surface)); margin-block: 12px 16px; }.mw-meter > span { display: block; width: var(--bar); height: 100%; background: var(--mw-accent); border-radius: inherit; transform-origin: left; animation: mw-grow var(--mw-loop) ease-in-out infinite; }.mw-spend-limit { margin-top: 22px; --mw-accent: var(--ci-bills-accent); }
.mw-alert-line { display: flex; align-items: center; gap: 12px; margin-top: 20px; padding: 15px; border-radius: 11px; background: color-mix(in srgb, var(--ci-bills-accent) 9%, var(--mw-surface)); border: 1px solid color-mix(in srgb, var(--ci-bills-accent) 25%, var(--mw-border)); animation: mw-notice var(--mw-loop) ease-in-out infinite; }.mw-alert-line > i { color: var(--ci-bills-accent); font-size: 22px; }.mw-alert-line b { font-size: .82em; }.mw-alert-line small { font-size: .68em; margin-top: 4px; }
.mw-investment-kpis { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; border-block: 1px solid var(--mw-border); margin-top: 22px; padding: 15px 0; }.mw-investment-kpis small { font-size: .52em; letter-spacing: .03em; }.mw-investment-kpis b { display: block; color: var(--mw-accent); font-size: .9em; margin-top: 5px; }
.mw-holdings-preview > div { display: grid; grid-template-columns: 40px 1fr auto; gap: 10px; align-items: center; border-bottom: 1px solid var(--mw-border); padding: 12px 0; font-size: .8em; }.mw-symbol { display: inline-grid; place-items: center; width: 37px; height: 33px; border-radius: 9px; background: var(--mw-soft); color: var(--mw-accent); font-size: .78em; font-weight: 800; }.mw-holdings-preview b { text-align: right; }.mw-holdings-preview small { font-weight: 500; margin-top: 3px; }
.mw-comparison-values { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }.mw-comparison-values small { font-size: .6em; letter-spacing: .06em; }.mw-comparison-values b { display: block; font-size: 2.2em; color: var(--mw-accent); margin-block: 6px; }.mw-comparison-values div:nth-child(2) b { color: var(--ci-primary); }.mw-comparison-values span { color: var(--mw-muted); font-size: .73em; }
.mw-benchmark-chart { position: relative; }.mw-benchmark-chart > svg:last-child { position: absolute; inset: 0; width: 100%; height: 100%; }.mw-benchmark-line { stroke: var(--ci-primary); stroke-width: 2; stroke-dasharray: 100; animation: mw-line var(--mw-loop) ease-in-out infinite; }
.mw-chart-legend { display: flex; align-items: center; gap: 20px; margin-top: 17px; font-size: .67em; color: var(--mw-muted); }.mw-chart-legend span { display: flex; align-items: center; gap: 6px; }.mw-chart-legend i { display: inline-block; width: 14px; height: 3px; background: var(--mw-accent); }.mw-chart-legend span:nth-child(2) i { background: var(--ci-primary); }
.mw-growth-sources { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-block: 24px; }.mw-growth-sources > span { padding: 13px; border: 1px solid var(--mw-border); border-radius: 9px; font-size: .53em; color: var(--mw-muted); letter-spacing: .03em; }.mw-growth-sources b { display: block; font-size: 2em; color: var(--mw-text); margin-top: 7px; }
.mw-return-calendar { display: grid; grid-template-columns: repeat(6, 1fr); gap: 5px; }.mw-return-calendar > span { border-radius: 6px; background: color-mix(in srgb, var(--ci-investments-accent) 10%, var(--mw-surface)); color: var(--mw-muted); text-align: center; padding: 9px 4px; font-size: .65em; }.mw-return-calendar b { display: block; color: var(--ci-investments-accent); margin-top: 4px; }.mw-return-calendar .is-negative { background: color-mix(in srgb, var(--ci-liabilities-accent) 8%, var(--mw-surface)); }.mw-return-calendar .is-negative b { color: var(--ci-liabilities-accent); }
.mw .mw-demo-note { margin: 16px 0 0; font-size: .66em; line-height: 1.6; color: var(--mw-muted); }
.mw-income-months { display: flex; align-items: end; justify-content: space-between; height: 120px; gap: 12px; margin-block: 24px; }.mw-income-months > span { display: flex; flex-direction: column-reverse; align-items: center; gap: 9px; width: 14%; height: 100%; font-size: .65em; color: var(--mw-muted); }.mw-income-months i { display: block; width: 70%; height: var(--bar); border-radius: 6px 6px 0 0; background: var(--mw-accent); opacity: .65; transform-origin: bottom; animation: mw-grow var(--mw-loop) ease-in-out infinite; }
.mw-income-payment { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; padding-block: 16px; border-block: 1px solid var(--mw-border); }.mw-income-payment b, .mw-income-payment strong { font-size: .84em; }.mw-income-payment strong { color: var(--mw-accent); }.mw-income-coverage { margin-top: 24px; }.mw-income-coverage p { font-size: .76em; }
.mw-retirement-inputs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }.mw-retirement-inputs > div { padding: 13px 10px; background: var(--mw-soft); border-radius: 8px; }.mw-retirement-inputs small { font-size: .54em; letter-spacing: .04em; }.mw-retirement-inputs b { display: block; margin-top: 8px; font-size: .95em; }.mw-retirement-chart { position: relative; margin-top: 26px; }.mw-retirement-chart svg { width: 100%; height: auto; }.mw-target-line { stroke: var(--ci-bills-accent); stroke-width: 1.5; stroke-dasharray: 6 6; }.mw-target-label { position: absolute; top: 17%; left: 0; font-size: .66em; color: var(--ci-bills-accent); }.mw-plan-base { stroke: var(--ci-primary); stroke-width: 2; stroke-dasharray: 100; animation: mw-line var(--mw-loop) ease-in-out infinite; }.mw-plan-extra { stroke: var(--mw-accent); stroke-width: 3; stroke-dasharray: 100; animation: mw-line var(--mw-loop) ease-in-out infinite; animation-delay: 1s; }.mw-scenario-chip { padding: 14px; margin-top: 24px; border-radius: 9px; background: var(--mw-soft); font-size: .85em; font-weight: 700; color: var(--mw-accent); animation: mw-notice var(--mw-loop) ease-in-out infinite; }
.mw-rule-gauge { margin-top: 24px; --mw-accent: var(--ci-bills-accent); }.mw-threshold { position: absolute; height: 19px; width: 2px; top: -5px; left: 60%; background: var(--ci-bills-accent); }.mw-rule-options { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 18px; }.mw-rule-options > span { color: var(--mw-muted); font-size: .62em; border: 1px solid var(--mw-border); border-radius: 5px; padding: 6px 8px; }
.mw-checkup-heading { display: flex; align-items: center; gap: 13px; margin-bottom: 24px; }.mw-checkup-heading b { font-size: 1.1em; }.mw-checkup-heading small { margin-top: 4px; font-size: .75em; }.mw-checkup-item { display: grid; grid-template-columns: auto 1fr; column-gap: 12px; padding: 17px 0; border-top: 1px solid var(--mw-border); animation: mw-row var(--mw-loop) ease-in-out infinite; }.mw-checkup-item:nth-of-type(3) { animation-delay: 1s; }.mw-checkup-item:nth-of-type(4) { animation-delay: 2s; }.mw-checkup-dot { grid-row: span 2; width: 7px; height: 7px; background: var(--mw-accent); border-radius: 50%; margin-top: 6px; }.mw-checkup-dot.is-amber { background: var(--ci-bills-accent); }.mw-checkup-item b { font-size: .9em; }.mw-checkup-item > span:last-child { grid-column: 2; margin-top: 9px; color: var(--mw-accent); font-weight: 700; font-size: .75em; }
.mw-security-path { display: flex; align-items: center; gap: 9px; padding: 15px 0 35px; }.mw-security-path div { display: grid; justify-items: center; gap: 10px; flex: 1; }.mw-security-path i { font-size: 37px; color: var(--mw-accent); }.mw-security-path b { font-size: .8em; }.mw-security-path > span { width: 30px; height: 2px; background: var(--mw-border); }.mw-security-check { display: flex; align-items: center; gap: 12px; padding: 17px 0; border-top: 1px solid var(--mw-border); animation: mw-row var(--mw-loop) ease-in-out infinite; }.mw-security-check > i { color: var(--ci-investments-accent); font-size: 23px; }.mw-security-check b { font-size: .84em; }.mw-security-check small { margin-top: 5px; }
.mw-help-answer { display: flex; gap: 15px; padding: 18px; border: 1px solid var(--mw-border); border-radius: 13px; }.mw-help-answer b { font-size: .91em; }.mw-help-answer p { font-size: .81em; line-height: 1.75; margin: 8px 0 0; }.mw-help-options { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; margin-top: 20px; }.mw-help-options > span { display: grid; justify-items: center; gap: 9px; padding: 15px 6px; background: var(--mw-soft); border-radius: 10px; font-size: .65em; text-align: center; animation: mw-row var(--mw-loop) ease-in-out infinite; }.mw-help-options i { color: var(--mw-accent); font-size: 23px; }

/* Secondary pages and the static, scan-friendly release library. */
.mw-section-heading { max-width: 640px; margin-bottom: 40px; }.mw-section-heading p { font-size: 16px; line-height: 1.7; }
.mw-question-section { padding-block: 70px; }.mw-question-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 25px; }.mw-question-grid > div { border: 1px solid var(--mw-border); border-radius: 14px; padding: 23px; background: var(--mw-surface); }.mw-question-grid i { font-size: 26px; color: var(--ci-primary); }.mw-question-grid h3 { font-size: 14px; margin: 17px 0 12px; }.mw-question-grid p { font-size: 13px; line-height: 1.75; margin: 0; }
.mw-process { display: flex; align-items: center; gap: 24px; padding-block: 30px 80px; }.mw-process > div { flex: 1; }.mw-process div > span { display: block; font-size: 11px; color: var(--ci-primary); margin-bottom: 12px; font-weight: 800; }.mw-process b { font-size: 15px; }.mw-process p { font-size: 12px; margin-top: 7px; }.mw-process > i { color: var(--ci-primary); font-size: 23px; }
.mw-feature-links { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; padding-block: 35px 85px; }.mw-feature-links > a { padding: 28px; border: 1px solid var(--mw-border); border-radius: 16px; color: var(--mw-text); background: var(--mw-surface); transition: border-color .2s, transform .2s; }.mw-feature-links > a:hover { border-color: var(--ci-primary); transform: translateY(-3px); }.mw-feature-links i { font-size: 28px; color: var(--ci-primary); }.mw-feature-links h3 { margin: 20px 0 10px; font-size: 17px; }.mw-feature-links p { font-size: 13px; line-height: 1.7; }.mw-feature-links a > span { font-size: 12px; color: var(--ci-primary); font-weight: 700; }
.mw-investment-close { display: flex; align-items: center; gap: 24px; padding-block: 45px 65px; }.mw-investment-close > i { font-size: 35px; color: var(--ci-investments-accent); flex: none; }.mw-investment-close > div { flex: 1; }.mw-investment-close h2 { font-size: 20px; }.mw-investment-close p { font-size: 12px; line-height: 1.8; margin: 0; }.mw-investment-close .btn { flex: none; }
.mw-latest-heading { padding-block: 70px 0; }.mw-latest-stories .mw-story:first-child { padding-top: 40px; }
.mw .nf-library { padding-bottom: 85px; }
.mw .nf-areas { margin-top: 0; padding-top: 24px; }.mw .nf-library { padding-top: 40px; }.mw .nf-release-list.is-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; overflow: visible; }.mw .nf-release-list.is-list .nf-release-card { display: block; width: auto; min-width: 0; padding: 0; border: 1px solid var(--mw-border); border-radius: 14px; background: var(--mw-surface); overflow: hidden; }.mw .nf-release-copy { padding: 22px; }.mw .nf-release-copy h3 { font-size: 17px; line-height: 1.4; }.mw .nf-release-copy p { font-size: 13px; line-height: 1.7; }.mw-release-icon { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 23px; border-bottom: 1px solid var(--mw-border); background: var(--mw-soft); }.mw-release-icon > i { font-size: 37px; color: var(--ci-primary); }.mw-release-icon > span { color: var(--mw-muted); font-size: 11px; font-weight: 700; }
.mw-faq { padding-block: 50px 90px; max-width: 900px !important; }.mw-faq-group { margin-block: 20px 48px; }.mw-faq-group h2 { font-size: 21px; margin-bottom: 20px; }.mw-faq details { border-bottom: 1px solid var(--mw-border); }.mw-faq summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 64px; padding: 18px 0; cursor: pointer; font-weight: 700; font-size: 15px; list-style: none; color: var(--mw-text); }.mw-faq summary::-webkit-details-marker { display: none; }.mw-faq summary::after { content: "+"; flex: none; font-size: 22px; color: var(--ci-primary); }.mw-faq details[open] summary::after { content: "\2212"; }.mw-faq details > p { font-size: 14px; line-height: 1.9; padding: 0 35px 20px 0; margin: 0; }.mw-faq a { color: var(--ci-primary); text-decoration: underline; }
.mw-page-intro { padding: 160px 0 45px; background: linear-gradient(180deg, var(--ci-main-wrapper-background), var(--ci-base-page)); }.mw-page-intro h1 { max-width: 820px; }.mw-page-intro p { max-width: 640px; font-size: 18px; line-height: 1.8; }
.mw-support-form { padding-block: 50px 90px; }.mw-support-form > .mw-form-card { max-width: 740px; margin: 0 auto; border: 1px solid var(--mw-border); border-radius: 18px; background: var(--mw-surface); padding: clamp(24px, 4vw, 45px); }.mw-support-form .form-control { background: var(--ci-base-page); border-color: var(--mw-border); color: var(--mw-text); }.mw-support-form .form-label { color: var(--mw-text); font-weight: 700; font-size: 13px; }.mw-support-form .form-text { color: var(--mw-muted); }.mw-security-legal { padding-block: 0 80px; }.mw-security-legal > div { padding: 30px; border: 1px solid var(--mw-border); border-radius: 16px; }.mw-security-legal h2 { font-size: 21px; }.mw-security-legal p { font-size: 13px; line-height: 1.9; }.mw-security-legal a { color: var(--ci-primary); text-decoration: underline; }
.mw-maker-portrait { margin: 0; border-radius: 22px; overflow: hidden; border: 1px solid var(--mw-border); background: var(--mw-surface); box-shadow: var(--mw-shadow); }.mw-maker-portrait img { display: block; width: 100%; height: auto; }.mw-maker-portrait figcaption { display: flex; justify-content: space-between; gap: 12px; padding: 20px; font-size: 13px; color: var(--mw-muted); }.mw-maker-portrait b { color: var(--mw-text); }

/* Compact, keyboard-operable navigation; the product dropdown is native details. */
.mw-nav .navbar-brand { padding-right: 12px !important; }.mw-nav .navbar-brand img { height: 56px; width: auto; }.mw-nav .navbar-nav { gap: 4px; }.mw-nav .navbar-nav .nav-link { font-size: 13px; padding-inline: 13px; }.mw-nav-details { position: relative; }.mw-nav-details summary { cursor: pointer; list-style: none; display: flex; align-items: center; gap: 5px; }.mw-nav-details summary::-webkit-details-marker { display: none; }.mw-nav-details summary i { font-size: 18px; }.mw-nav-details[open] summary i { transform: rotate(180deg); }.mw-nav-dropdown { position: absolute; top: calc(100% + 9px); left: 0; width: 300px; padding: 9px; border: 1px solid var(--bs-border-color, #e1e4ef); border-radius: 14px; background: var(--bs-body-bg, #fff); box-shadow: 0 20px 50px #0002; z-index: 1045; }.mw-nav-dropdown a { display: flex; align-items: center; gap: 12px; min-height: 60px; padding: 11px; border-radius: 8px; text-decoration: none; color: var(--bs-heading-color, #0b0f19); }.mw-nav-dropdown a:hover, .mw-nav-dropdown a.active { background: color-mix(in srgb, var(--bs-primary, #5a45e6) 8%, transparent); }.mw-nav-dropdown a > i { color: var(--bs-primary, #5a45e6); font-size: 22px; }.mw-nav-dropdown b { display: block; font-size: 13px; }.mw-nav-dropdown small { display: block; font-size: 10px; color: var(--bs-body-color, #565973); margin-top: 3px; }.mw-nav a:focus-visible, .mw-nav summary:focus-visible { outline: 3px solid #8b7df2; outline-offset: 3px; }.mw-nav-tools { display: flex; align-items: center; gap: 15px; }.mw-nav-signin { font-size: 12px; font-weight: 700; color: var(--bs-heading-color, #0b0f19); text-decoration: none; }.mw-nav .mode-switch { margin: 0 !important; }.mw-nav .mode-switch label { font-size: 11px; }.mw-nav-getapp { white-space: nowrap; font-size: 12px; }.mw-nav-mobile-signin { display: none; }

/* A quiet secondary action beside the app download button. */
.mw-nav .mw-nav-signin {
    --ci-primary: #5a45e6;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 40px;
    padding: 8px 14px;
    border: 1px solid color-mix(in srgb, var(--ci-primary) 24%, transparent);
    border-radius: 10px;
    background: color-mix(in srgb, var(--ci-primary) 6%, transparent);
    color: #4935cf;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.5;
    text-decoration: none;
    white-space: nowrap;
    transition: background-color .15s ease, border-color .15s ease;
}
.mw-nav .mw-nav-signin > i { font-size: 18px; }
.mw-nav .mw-nav-signin:hover, .mw-nav .mw-nav-signin:focus-visible {
    border-color: var(--ci-primary);
    background: color-mix(in srgb, var(--ci-primary) 12%, transparent);
    color: #4935cf;
}
[data-bs-theme="dark"] .mw-nav .mw-nav-signin { --ci-primary: #a091ff; color: #e0dbff; }
[data-bs-theme="dark"] .mw-nav .mw-nav-signin:hover, [data-bs-theme="dark"] .mw-nav .mw-nav-signin:focus-visible { color: #fff; }
.mw-nav .mw-nav-mobile-signin .mw-nav-signin { display: flex; min-height: 48px; margin-top: 12px; font-size: 14px; }
@media (prefers-reduced-motion: reduce) { .mw-nav .mw-nav-signin { transition: none; } }
html[data-a11y-reduce-motion="on"] .mw-nav .mw-nav-signin { transition: none; }

/* Progressive motion: paused by visibility, user choice, OS preference, and the app's preference. */
[data-bs-theme="dark"] .mw-nav-dropdown { background: #151c2b; border-color: #2b3449; }
[data-bs-theme="dark"] .mw-nav-dropdown a { color: #eef0fa; }
[data-bs-theme="dark"] .mw-nav-dropdown small { color: #afb5ca; }
.mw-nav-app .mw-nav-dropdown { left: auto; right: 0; width: 245px; }
.mw-hero .mw-demo { --mw-shadow: 0 28px 80px -35px #37305c55; }
.mw-security-heading { display: flex; align-items: center; gap: 12px; margin-bottom: 24px; }.mw-security-heading div { flex: 1; }.mw-security-heading b, .mw-security-heading small { display: block; }.mw-security-heading small { color: var(--mw-muted); font-size: .72em; margin-top: 4px; }.mw-security-range { margin: 24px 0; }.mw-security-range > div:last-child { display: flex; justify-content: space-between; gap: 8px; font-size: .7em; color: var(--mw-muted); margin-top: 9px; }.mw-security-range b { color: var(--mw-text); }.mw-price-marker { position: absolute; left: 72.5%; top: -4px; height: 17px; width: 3px; background: var(--mw-text); border-radius: 3px; }.mw-rule-gauge .mw-threshold { left: 30%; }
@keyframes mw-line { 0%, 5% { stroke-dashoffset: 100; } 30%, 92% { stroke-dashoffset: 0; } 100% { stroke-dashoffset: 100; } }
@keyframes mw-grow { 0%, 6% { transform: scale(.08); opacity: .5; } 32%, 90% { transform: scale(1); opacity: 1; } 100% { transform: scale(.08); opacity: .5; } }
@keyframes mw-row { 0%, 6% { transform: translateY(6px); } 20%, 88% { transform: translateY(0); } 100% { transform: translateY(6px); } }
@keyframes mw-notice { 0%, 32% { transform: translateY(7px); } 42%, 88% { transform: translateY(0); } 100% { transform: translateY(7px); } }
@keyframes mw-think { 0%, 24% { opacity: .5; transform: scale(.95); } 9%, 19% { opacity: 1; transform: scale(1.12); } 32%, 100% { opacity: 1; transform: scale(1); } }
@keyframes mw-flow { 0%, 20% { transform: translateY(-4px); } 26%, 100% { transform: translateY(0); } }
@keyframes mw-tag { 0%, 28% { transform: scale(.95); } 38%, 90% { transform: scale(1); } 100% { transform: scale(.95); } }
@keyframes mw-answer { 0%, 20% { transform: translateY(6px); } 32%, 90% { transform: translateY(0); } 100% { transform: translateY(6px); } }
@keyframes mw-split { 0%, 15% { transform: scaleX(.9); } 30%, 90% { transform: scaleX(1); } 100% { transform: scaleX(.9); } }
@keyframes mw-packet { 0%, 100% { left: 0; opacity: .3; } 50% { left: calc(100% - 8px); opacity: 1; } }
.mw-demo[data-in-view="false"] *, .mw-demo[data-in-view="false"] *::after, html[data-mw-hidden="true"] .mw * { animation-play-state: paused !important; }
.mw-demo[data-paused="true"] *, .mw-demo[data-paused="true"] *::after { animation: none !important; }
html[data-a11y-reduce-motion="on"] .mw *, html[data-a11y-reduce-motion="on"] .mw *::before, html[data-a11y-reduce-motion="on"] .mw *::after { animation: none !important; transition: none !important; }
@media (prefers-reduced-motion: reduce) { .mw *, .mw *::before, .mw *::after { animation: none !important; transition: none !important; }.mw-motion-toggle { display: none !important; } }
html[data-a11y-reduce-motion="on"] .mw-motion-toggle { display: none !important; }
@media (min-width: 992px) and (max-width: 1199.98px) { .mw-nav .navbar-nav .nav-link { padding-inline: 8px; font-size: 12px; }.mw-nav .navbar-brand img { height: 48px; }.mw-nav-tools { gap: 11px; }.mw-nav .mode-switch label { display: none !important; } }
@media (max-width: 991.98px) {
    .mw-hero { padding: 130px 0 60px; }.mw-hero-grid { grid-template-columns: 1fr; gap: 50px; }.mw-hero-copy { max-width: 690px; }.mw h1 { font-size: clamp(42px, 7.5vw, 62px); }.mw-hero-grid > .mw-demo, .mw-hero-art { width: 100%; max-width: 640px; margin: 0 auto; }.mw-hero-art::before { inset: -13px -5px 20px; }
    .mw-story { gap: 36px; }.mw-story h2 { font-size: 32px; }.mw-story-copy > p { font-size: 14px; }.mw-benefits li { font-size: 12px; }.mw-platform-icons > i { font-size: 64px; padding: 15px; }.mw-question-grid { grid-template-columns: 1fr 1fr; }.mw .nf-release-list.is-list { grid-template-columns: 1fr 1fr; }.mw-demo { font-size: 12px; }.mw-signal-toast .mw-pill { display: none; }
    .mw-nav-dropdown { position: static; width: 100%; margin: 4px 0 12px; box-shadow: none; }.mw-nav-details summary { justify-content: space-between; }.mw-nav .navbar-nav .nav-link { min-height: 48px; font-size: 15px; }.mw-nav-mobile-signin { display: block; }.mw-nav-tools { display: none; }.mw-nav .navbar-brand img { height: 48px; }
}
@media (max-width: 767.98px) {
    .mw .container { padding-inline: 20px; }.mw-hero { padding-top: 118px; }.mw h1, .mw-home h1 { font-size: clamp(40px, 9vw, 58px); }.mw-lead { font-size: 16px; line-height: 1.8; }.mw-actions { gap: 16px; }.mw .btn-lg { font-size: 14px; padding: 14px 21px; }.mw-eyebrow { font-size: 9px; }.mw-reassurance { font-size: 10px; }.mw-area-nav { justify-content: start; gap: 2px 18px; }
    .mw-story { grid-template-columns: 1fr; padding-block: 60px; gap: 30px; }.mw-story.is-reversed .mw-story-copy { order: initial; }.mw-story h2 { font-size: 34px; }.mw-story-copy > p { font-size: 15px; }.mw-benefits li { font-size: 13px; }.mw-story > .mw-demo { max-width: 560px; margin: 0 auto; }.mw-demo { font-size: 13px; }.mw-window-bar { padding-inline: 15px; }.mw-demo-padding { padding: 22px; }.mw-hero-grid { gap: 36px; }
    .mw-platform { grid-template-columns: 1fr; gap: 35px; padding-block: 30px 60px; }.mw-platform h2 { font-size: 32px; }.mw-platform-icons > i { font-size: 72px; }.mw-trust-grid { gap: 24px; grid-template-columns: 1fr; padding-block: 0 60px; }.mw-feature-links { grid-template-columns: 1fr; padding-top: 20px; }.mw-process { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }.mw-process > i { display: none; }.mw-investment-close { flex-wrap: wrap; }.mw-investment-close > div { flex-basis: 80%; }.mw-investment-close .btn { margin-left: 58px; }.mw-page-intro { padding-top: 120px; }.mw-page-intro p { font-size: 16px; }
}
@media (max-width: 399.98px) {
    .mw .container { padding-inline: 16px; }.mw h1, .mw-home h1 { font-size: 39px; }.mw-demo { font-size: 12px; }.mw-demo-padding { padding: 18px; }.mw-merchant { gap: 8px; }.mw-merchant strong { font-size: 1.15em; }.mw-question-grid { grid-template-columns: 1fr; }.mw .nf-release-list.is-list { grid-template-columns: 1fr; }.mw-return-calendar { grid-template-columns: repeat(3, 1fr); }.mw-rule-preview > div { grid-template-columns: 1fr auto; }.mw-rule-preview .mw-pill { grid-column: 1 / -1; justify-self: start; }.mw-window-dots { display: none; }.mw-retirement-inputs small { font-size: .5em; }.mw-bill-strip { gap: 5px; }.mw-bill-strip span { padding: 8px 5px; }.mw-window-bar { font-size: .76em; }
}

/* All Features: floating cards inspired by the original New Features hero. */
.mw-features-hero { padding-bottom: 64px; }
.mw-features-hero .mw-hero-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 38px; }
.mw-features-hero h1 { font-size: clamp(42px, 4.25vw, 61px); }
.fs #fs-index-title { scroll-margin-top: 110px; }
.fs-capabilities .fs-reel { margin-inline: 0; }
.mw-capability-demo.mw-demo { border: 0; background: transparent; box-shadow: none; font-size: clamp(10px, 1vw, 14px); --mw-loop: 16s; }
.mw-capability-demo .mw-demo-body { overflow: visible; border-radius: 0; }
.mw-capability-demo figcaption { border: 0; padding-inline: 20px; }
.af-stage { position: relative; width: 100%; aspect-ratio: 600 / 570; isolation: isolate; }
.af-aura { position: absolute; inset: 3% 0 0; background: radial-gradient(ellipse at 65% 42%, color-mix(in srgb, var(--ci-primary) 14%, transparent), transparent 62%), radial-gradient(circle, color-mix(in srgb, var(--ci-primary) 20%, transparent) 1px, transparent 1.5px); background-size: auto, 20px 20px; mask-image: radial-gradient(ellipse at center, #000 25%, transparent 72%); }
.af-connections { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.af-connections path { stroke: var(--ci-primary); stroke-width: 1.6; stroke-dasharray: 4 7; opacity: .35; animation: af-flow 1.8s linear infinite; }
.af-card { position: absolute; border: 1px solid var(--mw-border); border-radius: 1.3em; background: var(--mw-surface); box-shadow: 0 14px 36px -12px color-mix(in srgb, var(--mw-text) 22%, transparent); }
.af-main { z-index: 1; left: 25%; top: 15%; width: 70%; padding: 1.3em; background: linear-gradient(135deg, var(--mw-soft), var(--mw-surface) 65%); transform: rotate(-3deg); animation: af-main-float var(--mw-loop) ease-in-out infinite; }
.af-main-top { display: flex; align-items: center; justify-content: space-between; gap: .6em; color: var(--ci-primary); font-size: .64em; font-weight: 800; letter-spacing: .11em; margin-bottom: 1.3em; }
.af-main-top > i { font-size: 1.6em; }
.af-muted { color: var(--mw-muted); }
.af-caption { display: block; font-size: .92em; font-weight: 700; margin-bottom: .25em; }
.af-balance { font-size: 2.4em; font-weight: 800; line-height: 1.25; letter-spacing: -.045em; font-variant-numeric: tabular-nums; }
.af-number-window { display: block; height: 1.25em; overflow: hidden; }
.af-number-roll { display: flex; flex-direction: column; transform: translateY(-66.6667%); animation: af-balance-roll var(--mw-loop) ease-in-out infinite; }
.af-number-roll b { line-height: 1.25; flex: none; font-weight: inherit; }
.af-main-meta { display: flex; align-items: center; justify-content: space-between; gap: .6em; font-size: .68em; margin-top: .8em; color: var(--mw-muted); }
.af-positive { display: inline-flex; align-items: center; gap: .35em; padding: .35em .65em; border-radius: 99px; color: var(--ci-investments-accent); background: color-mix(in srgb, var(--ci-investments-accent) 12%, transparent); font-weight: 800; }
.af-chart { display: block; width: 100%; height: auto; margin: .9em 0 1em; overflow: visible; }
.af-chart-area { fill: color-mix(in srgb, var(--ci-primary) 9%, transparent); }
.af-chart-line { stroke: var(--ci-primary); stroke-width: 2.4; stroke-linecap: round; stroke-dasharray: 100; animation: mw-line var(--mw-loop) ease-in-out infinite; }
.af-chart circle { fill: var(--ci-primary); stroke: var(--mw-surface); stroke-width: 2; }
.af-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: .75em; }
.af-metrics > div { background: var(--mw-surface); border: 1px solid var(--mw-border); border-radius: .75em; padding: .85em; }
.af-metrics span { display: flex; align-items: center; gap: .35em; font-size: .62em; color: var(--mw-muted); white-space: nowrap; }
.af-metrics b { display: block; font-size: 1.4em; margin: .18em 0; font-variant-numeric: tabular-nums; }
.af-metrics small { font-size: .56em; }
.af-left b, .af-left i { color: var(--ci-investments-accent); }
.af-main-footer { display: flex; align-items: center; gap: .6em; margin-top: 1.1em; font-size: .62em; color: var(--mw-muted); }
.af-sync-dot { width: .7em; height: .7em; background: var(--ci-investments-accent); border-radius: 50%; box-shadow: 0 0 0 .35em color-mix(in srgb, var(--ci-investments-accent) 10%, transparent); }
.af-icon { display: inline-grid; place-items: center; width: 2.6em; height: 2.6em; flex: none; border-radius: 50%; background: var(--mw-soft); color: var(--ci-primary); }
.af-icon i { font-size: 1.5em; }
.af-icon.is-green { color: var(--ci-investments-accent); background: color-mix(in srgb, var(--ci-investments-accent) 10%, transparent); }
.af-card small { font-size: max(8px, .55em); font-weight: 800; letter-spacing: .12em; margin-bottom: .45em; }
.af-bank { z-index: 3; left: 1%; top: -2%; width: 54%; display: flex; align-items: center; gap: .85em; padding: 1.05em; transform: rotate(2deg); animation: af-bank-float var(--mw-loop) ease-in-out infinite; }
.af-bank b { display: block; font-size: max(11px, .88em); }
.af-bank div > span { display: block; font-size: max(8px, .62em); color: var(--mw-muted); margin-top: .3em; }
.af-bank em { display: flex; align-items: center; gap: .3em; font-size: .58em; color: var(--ci-investments-accent); font-style: normal; margin-top: .4em; }
.af-sync-ring { width: 1.65em; margin-left: auto; flex: none; color: var(--ci-investments-accent); }
.af-sync-ring svg { display: block; width: 100%; }
.af-sync-ring circle { stroke: currentColor; stroke-width: 1.4; opacity: .3; }
.af-sync-ring path { stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1; animation: af-check var(--mw-loop) ease-in-out infinite; }
.af-invest { z-index: 3; top: 46%; right: -1%; width: 54%; display: flex; align-items: center; gap: .8em; padding: 1em; transform: rotate(2deg); animation: af-invest-float var(--mw-loop) ease-in-out infinite; }
.af-invest b { display: block; font-size: max(11px, .85em); }
.af-invest div > span { display: block; font-size: max(8px, .62em); color: var(--mw-muted); margin-top: .3em; }
.af-alert-check { margin-left: auto; color: var(--ci-investments-accent); font-size: 1.1em; }
.af-sharing { z-index: 4; left: 0; top: 74%; width: 48%; padding: .95em; font-size: .92em; transform: rotate(-2deg); animation: af-share-float var(--mw-loop) ease-in-out infinite; }
.af-share-top { display: flex; align-items: center; gap: .65em; }
.af-share-top .af-icon { width: 2.2em; height: 2.2em; }
.af-share-top b { font-size: max(11px, .86em); }
.af-share-ratio { margin-left: auto; font-size: .65em; font-weight: 700; padding: .3em .5em; color: var(--ci-primary); background: var(--mw-soft); border-radius: 99px; white-space: nowrap; }
.af-split-bar { display: flex; gap: .2em; height: .55em; border-radius: 99px; overflow: hidden; margin: 1em 0 .65em; transform-origin: left; animation: af-split-fill var(--mw-loop) ease-in-out infinite; }
.af-split-bar span:first-child { width: 60%; background: var(--ci-primary); }.af-split-bar span:last-child { width: 40%; background: var(--ci-investments-accent); }
.af-split-labels { display: flex; align-items: center; justify-content: space-between; gap: .5em; font-size: max(9px, .67em); }
.af-split-labels > span { display: flex; align-items: center; gap: .4em; }
.af-avatar { display: inline-grid; place-items: center; width: 1.8em; height: 1.8em; border-radius: 50%; color: white; background: #5a45e6; font-size: .85em; font-weight: 800; font-style: normal; }
.af-avatar.is-green { background: #168052; }
.af-share-status { display: flex; align-items: center; gap: .35em; color: var(--ci-investments-accent); font-size: max(8px, .59em); margin-top: .8em; animation: af-share-status var(--mw-loop) ease-in-out infinite; }
.af-recap { z-index: 2; right: 1%; bottom: 2%; padding: .8em 1em; display: flex; align-items: center; gap: .6em; font-size: .67em; border-radius: 99px; }
.af-recap > i { color: var(--ci-primary); font-size: 1.5em; }.af-recap > i:last-child { color: var(--ci-investments-accent); }
@keyframes af-flow { to { stroke-dashoffset: -22; } }
@keyframes af-main-float { 0%, 100% { transform: rotate(-3deg) translateY(0); } 50% { transform: rotate(-2deg) translateY(-6px); } }
@keyframes af-bank-float { 0%, 100% { transform: rotate(2deg) translateY(0); } 50% { transform: rotate(1deg) translateY(-5px); } }
@keyframes af-invest-float { 0%, 28%, 100% { transform: rotate(2deg) translateY(4px); } 42%, 88% { transform: rotate(1deg) translateY(-3px); } }
@keyframes af-share-float { 0%, 100% { transform: rotate(-2deg) translateY(0); } 50% { transform: rotate(-1deg) translateY(4px); } }
@keyframes af-balance-roll { 0%, 8% { transform: translateY(0); } 22%, 30% { transform: translateY(-33.3333%); } 42%, 95% { transform: translateY(-66.6667%); } 100% { transform: translateY(0); } }
@keyframes af-check { 0%, 5% { stroke-dashoffset: 1; } 15%, 95% { stroke-dashoffset: 0; } 100% { stroke-dashoffset: 1; } }
@keyframes af-split-fill { 0%, 25% { transform: scaleX(.1); } 45%, 95% { transform: scaleX(1); } 100% { transform: scaleX(.1); } }
@keyframes af-share-status { 0%, 40% { opacity: 0; transform: translateY(3px); } 50%, 95% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(3px); } }
@media (max-width: 991.98px) {
    .mw-features-hero .mw-hero-grid { grid-template-columns: 1fr; gap: 40px; }
    .mw-capability-demo.mw-demo { max-width: 600px; font-size: 14px; margin-inline: auto; }
    .mw-features-hero .mw-hero-copy { max-width: 620px; }
}
@media (max-width: 575.98px) {
    .mw-capability-demo.mw-demo { font-size: 12px; }
    .af-stage { aspect-ratio: 350 / 570; }
    .af-main { left: 6%; top: 17%; width: 91%; padding: 1em; }
    .af-main-top { margin-bottom: 1em; }
    .af-chart { height: 65px; margin: .8em 0; }
    .af-bank { left: 0; top: 1%; width: 78%; font-size: .9em; }
    .af-invest { right: 0; top: 35%; width: 78%; font-size: .9em; }
    .af-sharing { left: 0; top: 76%; width: 78%; font-size: .9em; }
    .af-recap { display: none; }
    .af-card small, .af-bank div > span, .af-bank em, .af-invest div > span, .af-metrics span { font-size: 8px; }
    .af-bank b, .af-invest b, .af-share-top b { font-size: 11px; }
    .af-metrics small { font-size: 8px; letter-spacing: 0; font-weight: 500; }
    .af-split-labels { font-size: 10px; }
    .af-share-status { font-size: 9px; }
    .mw-features-hero { padding-bottom: 32px; }
    .mw-features-hero h1 { font-size: clamp(37px, 8.8vw, 49px); }
    .mw-capability-demo figcaption { padding-inline: 0; }
}
/* Reports and budgeting stories. Synthetic native-text examples, scoped away from the signed-in workspace. */
.mr-pricing-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.mr-pricing-grid > a { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; padding: 28px; border: 1px solid var(--mw-border); border-radius: 18px; background: var(--mw-surface); color: var(--mw-text); }
.mr-pricing-grid > a > i { color: var(--ci-primary); font-size: 30px; margin: 24px 0 14px; }
.mr-pricing-grid h3 { font-size: 23px; font-weight: 800; }
.mr-pricing-grid p, .mr-pricing-extra { color: var(--mw-muted); font-size: 13px; line-height: 1.8; }
.mr-pricing-extra { display: block; padding: 15px 0 25px; border-top: 1px solid var(--mw-border); }
.mr-pricing-extra .mr-tier { margin-right: 6px; }
.mr-pricing-grid > a > b { margin-top: auto; font-size: 13px; color: var(--ci-primary); }
@media (max-width: 767.98px) { .mr-pricing-grid { grid-template-columns: 1fr; } }
.mw-report-band { background: radial-gradient(ellipse at 75% 35%, color-mix(in srgb, var(--ci-primary) 10%, transparent), transparent 65%); }
.mw-budget-band { background: radial-gradient(ellipse at 78% 30%, color-mix(in srgb, var(--ci-investments-accent) 9%, transparent), transparent 65%); }
.mr-library, .mr-pace-section { padding-block: 75px; scroll-margin-top: 110px; }
.mr-section-heading { max-width: 760px; margin: 0 auto 38px; text-align: center; }
.mr-section-heading h2, .mr-crosslink h2, .mr-budget-access h2 { font-size: clamp(32px, 3.2vw, 46px); line-height: 1.16; font-weight: 800; letter-spacing: -.04em; margin: 14px 0 18px; }
.mr-section-heading p, .mr-crosslink p, .mr-budget-access p { color: var(--mw-muted); line-height: 1.8; font-size: 15px; }
.mr-library-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; }
.mr-library-grid > * { display: block; min-width: 0; padding: 24px 20px; background: var(--mw-surface); border: 1px solid var(--mw-border); border-radius: 16px; color: var(--mw-text); }
.mr-library-grid > a { background: var(--mw-soft); transition: border-color .2s, box-shadow .2s; }
.mr-library-grid > a:hover { border-color: var(--ci-primary); box-shadow: var(--mw-shadow); }
.mr-library-grid > * > i { display: inline-grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; color: var(--ci-primary); background: var(--mw-soft); font-size: 22px; }
.mr-library-grid h3 { font-size: 15px; font-weight: 800; margin: 18px 0 9px; }
.mr-library-grid h3 > i { color: var(--ci-primary); }
.mr-library-grid p { color: var(--mw-muted); font-size: 12px; line-height: 1.7; margin: 0; }
.mr-tier { display: inline-flex; border: 1px solid color-mix(in srgb, var(--ci-primary) 28%, var(--mw-border)); background: color-mix(in srgb, var(--ci-primary) 10%, var(--mw-surface)); color: var(--ci-primary); padding: 5px 9px; border-radius: 30px; font-size: 10px; letter-spacing: .02em; font-weight: 800; white-space: nowrap; }
.mw-eyebrow .mr-tier { margin-right: 8px; }
.mr-crosslink { display: flex; justify-content: space-between; align-items: center; gap: 30px; padding-block: 60px 90px; }
.mr-crosslink > div { max-width: 560px; }
.mr-crosslink p { margin-bottom: 0; }
.mr-pace-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.mr-pace-grid article { position: relative; border: 1px solid var(--mw-border); border-radius: 18px; padding: 30px; background: var(--mw-surface); }
.mr-pace-grid article > span { position: absolute; right: 22px; top: 20px; font-size: 11px; color: var(--mw-muted); }
.mr-pace-grid article > i { font-size: 30px; color: var(--ci-primary); }
.mr-pace-grid h3 { font-size: 18px; font-weight: 800; margin: 18px 0 12px; }
.mr-pace-grid p { font-size: 14px; color: var(--mw-muted); line-height: 1.7; margin: 0; }
.mr-fine-print { font-size: 12px; color: var(--mw-muted); text-align: center; margin: 22px 0 0; }
.mr-budget-access { display: grid; grid-template-columns: 1.1fr .9fr; align-items: center; gap: 80px; padding-block: 80px; }
.mr-access-card { padding: 32px; background: var(--mw-surface); border: 1px solid var(--mw-border); border-radius: 18px; }
.mr-access-card h3 { font-size: 19px; font-weight: 800; margin-top: 18px; }
.mr-access-card p { font-size: 13px; }
.mr-access-card .mr-tier { margin-top: 10px; }
.mr-access-card .btn { margin-top: 12px; }
.mr-demo-content { padding: clamp(18px, 2.2vw, 30px); }
.mr-demo-content > small { font-size: 10px; letter-spacing: .045em; }
.mr-filter { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; font-size: 10px; margin-bottom: 20px; color: var(--mw-muted); }
.mr-filter > span, .mr-depth > span { padding: 6px 9px; border: 1px solid var(--mw-border); border-radius: 7px; }
.mr-filter .is-selected, .mr-depth .is-selected { background: var(--mw-soft); color: var(--ci-primary); font-weight: 800; }
.mr-kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; margin-bottom: 23px; }
.mr-kpis.is-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.mr-kpis > div { padding: 12px; border: 1px solid var(--mw-border); border-radius: 10px; background: var(--mw-soft); }
.mr-kpis small { font-size: 10px; }
.mr-kpis b { display: block; font-size: clamp(18px, 1.6vw, 24px); font-weight: 800; margin-top: 6px; line-height: 1.2; }
.mr-good { color: var(--ci-investments-accent); }
.mr-caution { color: var(--ci-bills-accent); }
.mr-flow-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 12px; }
.mr-flow-head > span { color: var(--mw-muted); font-size: 10px; }
.mr-flow { width: 100%; height: auto; margin-top: 18px; display: block; }
.mr-ribbon { opacity: .2; }
.mr-ribbon.is-housing, .mr-flow-housing { fill: var(--ci-primary); }
.mr-ribbon.is-food, .mr-flow-food { fill: var(--ci-bills-accent); }
.mr-ribbon.is-other, .mr-flow-other { fill: #568fba; }
.mr-ribbon.is-kept, .mr-flow-source { fill: var(--ci-investments-accent); }
.mr-flow-trace { fill: none; stroke: color-mix(in srgb, var(--mw-text) 30%, var(--mw-surface)); stroke-width: 2; stroke-dasharray: 3 8; opacity: .9; animation: mr-flow 9s linear infinite; }
.mr-flow-trace.is-2 { animation-delay: -3s; }
.mr-flow-trace.is-3 { animation-delay: -6s; }
.mr-flow-legend { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 20px 0; font-size: 10px; }
.mr-flow-legend b { display: block; color: var(--mw-text); font-size: 14px; margin-top: 5px; }
.mr-flow-legend i, .mr-category-list > div > i { display: inline-block; width: 6px; height: 6px; margin-right: 5px; border-radius: 50%; }
.mr-flow-legend .is-housing, .mr-category-list .is-housing { background: var(--ci-primary); }
.mr-flow-legend .is-food, .mr-category-list .is-food { background: var(--ci-bills-accent); }
.mr-flow-legend .is-other, .mr-category-list .is-other { background: #568fba; }
.mr-flow-legend .is-kept { background: var(--ci-investments-accent); }
.mr-note { display: flex; align-items: center; gap: 10px; padding: 14px; background: var(--mw-soft); border-radius: 10px; margin-top: 18px; font-size: 11px; }
.mr-note > i { color: var(--ci-primary); font-size: 20px; flex: none; }
.mr-note > i:last-child:not(:first-child) { margin-left: auto; }
.mr-note small { margin-top: 3px; font-size: 10px; }
.mr-arrive { animation: mr-arrive var(--mw-loop) ease-in-out infinite; }
.mr-explore-top { display: grid; grid-template-columns: 130px 1fr; align-items: center; gap: 20px; }
.mr-donut { width: 130px; aspect-ratio: 1; border-radius: 50%; background: conic-gradient(var(--ci-primary) 0 53.33%, var(--ci-bills-accent) 53.33% 73.33%, #568fba 73.33%); display: grid; place-items: center; }
.mr-donut > span { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 75%; aspect-ratio: 1; border-radius: 50%; background: var(--mw-surface); }
.mr-donut b { font-size: 22px; font-weight: 800; }
.mr-donut small { font-size: 9px; }
.mr-category-list { min-width: 0; }
.mr-category-list > div { display: flex; align-items: center; padding: 12px 8px; border-radius: 7px; gap: 5px; font-size: 11px; }
.mr-category-list b { margin-left: auto; white-space: nowrap; }
.mr-category-list .is-focus { color: var(--ci-bills-accent); background: color-mix(in srgb, var(--ci-bills-accent) 9%, var(--mw-surface)); animation: mr-focus var(--mw-loop) ease-in-out infinite; }
.mr-drill { margin-top: 23px; padding: 17px; border: 1px solid var(--mw-border); border-radius: 12px; }
.mr-drill > small { font-size: 9px; letter-spacing: .05em; }
.mr-drill-title { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 10px 0; }
.mr-drill-title > b { font-size: 29px; }
.mr-drill-title > span { font-size: 10px; }
.mr-purchase { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 0; border-top: 1px solid var(--mw-border); font-size: 11px; }
.mr-whatif { margin-top: 20px; }
.mr-whatif small { font-size: 9px; }
.mr-whatif b { display: block; font-size: 23px; margin-top: 5px; }
.mr-whatif b > span { font-size: 11px; color: var(--mw-muted); font-weight: 500; }
.mr-slider { height: 5px; background: var(--mw-border); border-radius: 5px; margin: 15px 0 10px; position: relative; }
.mr-slider > i { position: absolute; left: 80%; top: -4px; width: 14px; height: 14px; border: 3px solid var(--mw-surface); background: var(--ci-primary); border-radius: 50%; box-shadow: 0 1px 6px #0003; animation: mr-slider var(--mw-loop) ease-in-out infinite; }
.mr-worth-chart { height: 100px; }
.mr-bridge { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-top: 25px; }
.mr-bridge > div { height: 155px; position: relative; text-align: center; font-size: 11px; }
.mr-bridge i { position: absolute; width: 58%; left: 21%; bottom: calc(25px + var(--base) * .7); height: calc(var(--height) * .7); background: var(--ci-primary); border-radius: 5px 5px 2px 2px; transform-origin: bottom; animation: mr-grow var(--mw-loop) ease-in-out infinite; }
.mr-bridge .is-good i { background: var(--ci-investments-accent); }
.mr-bridge .is-good b { color: var(--ci-investments-accent); }
.mr-bridge span { position: absolute; bottom: 0; left: 0; right: 0; font-size: 9px; color: var(--mw-muted); }
.mr-chart-disclosure { font-size: 9px; color: var(--mw-muted); line-height: 1.5; display: block; margin: 12px 0 18px; }
.mr-networth-demo .mr-kpis { margin-bottom: 0; }
.mr-finding { display: flex; gap: 12px; border: 1px solid color-mix(in srgb, var(--ci-liabilities-accent) 24%, var(--mw-border)); border-left: 3px solid var(--ci-liabilities-accent); border-radius: 11px; padding: 18px; margin-bottom: 13px; animation: mr-arrive var(--mw-loop) ease-in-out infinite; }
.mr-finding:nth-child(2) { animation-delay: .6s; }
.mr-finding:nth-child(3) { animation-delay: 1.2s; }
.mr-finding > i { font-size: 22px; color: var(--ci-liabilities-accent); }
.mr-finding.is-amber { border-color: color-mix(in srgb, var(--ci-bills-accent) 24%, var(--mw-border)); border-left-color: var(--ci-bills-accent); }
.mr-finding.is-amber > i, .mr-finding.is-amber small { color: var(--ci-bills-accent); }
.mr-finding small { font-size: 9px; font-weight: 800; letter-spacing: .04em; color: var(--ci-liabilities-accent); }
.mr-finding b { display: block; font-size: 13px; margin-top: 5px; }
.mr-finding p { font-size: 11px; color: var(--mw-muted); margin: 6px 0 9px; }
.mr-finding span { color: var(--ci-primary); font-size: 10px; font-weight: 700; }
.mr-depth { display: flex; gap: 6px; justify-content: flex-end; font-size: 9px; margin-bottom: 22px; }
.mr-story-headline { font-size: clamp(22px, 2vw, 28px); line-height: 1.25; font-weight: 800; letter-spacing: -.025em; }
.mr-story-text { font-size: 12px; line-height: 1.8; color: var(--mw-muted); margin: 16px 0; }
.mr-facts { display: flex; flex-wrap: wrap; gap: 6px; }
.mr-facts span { padding: 5px 8px; font-size: 9px; border: 1px solid var(--mw-border); border-radius: 5px; background: var(--mw-soft); }
.mr-story-action { display: flex; gap: 10px; padding: 18px 14px; background: var(--mw-soft); border-radius: 10px; margin: 23px 0; font-size: 12px; }
.mr-story-action > i { color: var(--ci-primary); font-size: 20px; }
.mr-story-action small { font-size: 10px; margin-top: 5px; }
.mr-ask { display: flex; gap: 8px; color: var(--ci-primary); border: 1px solid var(--mw-border); border-radius: 30px; font-size: 11px; padding: 12px; }
.mr-email { display: flex; gap: 13px; align-items: center; margin: 22px 0; padding: 20px 14px; border: 1px solid var(--mw-border); border-radius: 12px; }
.mr-email > i { color: var(--ci-primary); font-size: 28px; }
.mr-email b { font-size: 13px; }
.mr-email small { font-size: 10px; margin-top: 3px; }
.mr-grounded { display: flex; align-items: center; gap: 5px; font-size: 9px; color: var(--mw-muted); }
.mr-budget-demo { --mw-accent: var(--ci-investments-accent); }
.mr-budget-summary { display: grid; grid-template-columns: 120px 1fr; gap: 20px; align-items: center; margin: 25px 0; }
.mr-budget-ring { display: grid; place-items: center; width: 120px; aspect-ratio: 1; border-radius: 50%; background: conic-gradient(var(--ci-investments-accent) 0 46%, var(--mw-border) 46%); }
.mr-budget-ring > span { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 82%; aspect-ratio: 1; background: var(--mw-surface); border-radius: 50%; }
.mr-budget-ring b { font-size: 23px; font-weight: 800; }
.mr-budget-ring small { color: var(--ci-investments-accent); font-size: 9px; font-weight: 800; margin-top: 3px; }
.mr-budget-summary > div > small { font-size: 9px; font-weight: 700; }
.mr-budget-summary h3 { font-size: 27px; font-weight: 800; margin: 7px 0 10px; }
.mr-budget-summary h3 > span { display: block; font-size: 11px; color: var(--mw-muted); font-weight: 500; margin-top: 5px; }
.mr-budget-summary p { font-size: 10px; color: var(--mw-muted); margin: 0 0 10px; }
.mr-status { display: inline-flex; align-items: center; gap: 4px; background: color-mix(in srgb, var(--ci-investments-accent) 10%, var(--mw-surface)); color: var(--ci-investments-accent); border-radius: 30px; padding: 5px 8px; font-size: 10px; font-weight: 800; }
.mr-budget-line { padding: 14px 0 10px; border-top: 1px solid var(--mw-border); }
.mr-budget-line > div:first-child { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 12px; }
.mr-budget-line b > i { color: var(--ci-primary); margin-right: 6px; }
.mr-budget-line > div:first-child > span { font-size: 10px; color: var(--mw-muted); white-space: nowrap; }
.mr-budget-line > small { display: flex; justify-content: space-between; font-size: 10px; margin-top: 9px; }
.mr-budget-line > small > span { color: var(--ci-investments-accent); }
.mr-budget-track { height: 7px; position: relative; background: var(--mw-border); border-radius: 10px; margin: 13px 0; }
.mr-budget-track::before { content: ""; position: absolute; width: var(--projected); height: 100%; left: 0; border-radius: inherit; background: repeating-linear-gradient(125deg, color-mix(in srgb, var(--ci-investments-accent) 27%, transparent) 0 4px, transparent 4px 8px); }
.mr-budget-track > i { display: block; height: 100%; width: var(--spent); border-radius: inherit; background: var(--ci-investments-accent); position: relative; transform-origin: left; animation: mr-fill var(--mw-loop) ease-in-out infinite; }
.mr-budget-track > em { position: absolute; width: 2px; height: 13px; background: var(--mw-muted); left: 50%; top: -3px; border: 2px solid var(--mw-surface); box-sizing: content-box; }
.mr-budget-key { display: flex; flex-wrap: wrap; gap: 14px; font-size: 9px; color: var(--mw-muted); margin-top: 8px; }
.mr-budget-key span { display: inline-flex; gap: 5px; align-items: center; }
.mr-budget-key i { width: 8px; height: 6px; background: var(--ci-investments-accent); border-radius: 2px; }
.mr-budget-key span:nth-child(2) i { background: repeating-linear-gradient(125deg, var(--ci-investments-accent) 0 2px, transparent 2px 4px); }
.mr-budget-key span:nth-child(3) i { width: 2px; height: 9px; background: var(--mw-muted); }
.mr-budget-demo .mr-chart-disclosure { margin-bottom: 0; }
.mr-suggestion { display: flex; align-items: center; gap: 12px; border: 1px dashed color-mix(in srgb, var(--ci-primary) 40%, var(--mw-border)); border-radius: 12px; padding: 18px; }
.mr-suggestion > i { color: var(--ci-bills-accent); font-size: 25px; }
.mr-suggestion b { font-size: 13px; }
.mr-suggestion small { font-size: 10px; margin-top: 3px; }
.mr-suggestion > span { padding: 8px 10px; margin-left: auto; background: var(--ci-primary); color: var(--mw-surface); border-radius: 7px; font-size: 12px; font-weight: 800; white-space: nowrap; }
.mr-setup-card { margin-top: 25px; padding: 22px; border: 1px solid var(--mw-border); border-radius: 12px; background: var(--mw-soft); }
.mr-setup-card > small { font-size: 9px; font-weight: 800; letter-spacing: .07em; }
.mr-target { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 20px 0; font-size: 12px; }
.mr-target b { font-size: 23px; }
.mr-target small { font-size: 10px; font-weight: 500; }
.mr-rollover { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 13px; background: var(--mw-surface); border: 1px solid var(--mw-border); border-radius: 8px; font-size: 11px; }
.mr-rollover b { color: var(--ci-investments-accent); font-size: 15px; }
.mr-setup-math { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 20px 0; color: var(--mw-muted); font-size: 10px; }
.mr-setup-math b { color: var(--mw-text); }
.mr-history-chart { display: flex; gap: 12px; height: 250px; position: relative; margin: 25px 0 30px; padding-top: 35px; border-bottom: 1px solid var(--mw-border); }
.mr-history-chart > div:not(.mr-target-line) { position: relative; flex: 1; min-width: 0; }
.mr-history-chart > div > i { position: absolute; width: 75%; left: 12.5%; height: var(--spent); bottom: 0; background: linear-gradient(to top, var(--ci-primary), color-mix(in srgb, var(--ci-primary) 64%, var(--mw-surface))); border-radius: 5px 5px 0 0; transform-origin: bottom; animation: mr-grow var(--mw-loop) ease-in-out infinite; animation-delay: var(--delay); }
.mr-history-chart > div > b { position: absolute; bottom: calc(var(--spent) + 8px); font-size: 10px; left: 0; right: 0; text-align: center; }
.mr-history-chart > div > span { position: absolute; top: calc(100% + 9px); left: 0; right: 0; font-size: 10px; text-align: center; color: var(--mw-muted); }
.mr-history-chart .mr-target-line { position: absolute; border-top: 1px dashed var(--ci-investments-accent); width: 100%; bottom: 77.4%; z-index: 1; }
.mr-target-line > span { top: auto !important; bottom: 6px; text-align: right !important; color: var(--ci-investments-accent) !important; }
.mr-budget-history-demo .mr-purchase { margin-top: 20px; color: var(--mw-muted); }
@keyframes mr-flow { to { stroke-dashoffset: -100; } }
@keyframes mr-arrive { 0%, 5% { opacity: .25; transform: translateY(8px); } 18%, 94% { opacity: 1; transform: translateY(0); } 100% { opacity: .25; transform: translateY(8px); } }
@keyframes mr-grow { 0%, 5% { transform: scaleY(.05); } 26%, 93% { transform: scaleY(1); } 100% { transform: scaleY(.05); } }
@keyframes mr-fill { 0%, 5% { transform: scaleX(.05); } 26%, 93% { transform: scaleX(1); } 100% { transform: scaleX(.05); } }
@keyframes mr-focus { 0%, 100% { box-shadow: 0 0 0 0 transparent; } 25%, 75% { box-shadow: 0 0 0 2px color-mix(in srgb, var(--ci-bills-accent) 25%, transparent); } }
@keyframes mr-slider { 0%, 5% { transform: translateX(20px); } 26%, 93% { transform: translateX(0); } 100% { transform: translateX(20px); } }
@media (max-width: 1199.98px) { .mr-library-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .mr-budget-access { gap: 35px; } }
@media (max-width: 767.98px) { .mr-library-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .mr-pace-grid, .mr-budget-access { grid-template-columns: 1fr; } .mr-crosslink { align-items: flex-start; flex-direction: column; } .mr-library, .mr-pace-section { padding-block: 50px; } }
@media (max-width: 575.98px) { .mr-library-grid { gap: 10px; } .mr-library-grid > * { padding: 18px 14px; } .mr-library-grid h3 { font-size: 14px; } .mr-library-grid p { font-size: 11px; } .mr-explore-top { grid-template-columns: 95px 1fr; gap: 10px; } .mr-donut { width: 95px; } .mr-donut b { font-size: 18px; } .mr-category-list > div { padding: 10px 6px; font-size: 10px; } .mr-category-list > div > i { display: none; } .mr-budget-summary { grid-template-columns: 100px 1fr; gap: 13px; } .mr-budget-ring { width: 100px; } .mr-budget-ring b { font-size: 20px; } .mr-budget-summary h3 { font-size: 24px; } .mr-setup-card { padding: 16px; } .mr-suggestion { gap: 8px; padding: 14px 12px; } .mr-suggestion > i { font-size: 20px; } .mr-suggestion small { font-size: 9px; } .mr-suggestion > span { padding: 7px; font-size: 11px; } .mr-bridge { gap: 5px; } .mr-bridge > div { font-size: 10px; } .mr-history-chart { gap: 7px; } .mr-flow-legend { grid-template-columns: repeat(2, minmax(0, 1fr)); } .mr-finding { padding: 14px; } .mr-budget-access { padding-block: 50px; } }
