/* Your Accounts — one account, step by step (2026-09-26). See accounts.js ("the account, step by step").
   Clean cards, one question at a time, big touch targets. Loaded before compass-mobile-tidy.css. */
.acct-card.aw { display:block; padding:0; margin:14px 0; border:1px solid var(--c-gray-90); border-radius:20px; background:var(--c-gray-99); box-shadow:0 6px 24px rgba(var(--c-shadow-rgb), 0.07); overflow:hidden; }
.aw-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px 20px 14px; border-bottom:1px solid var(--c-gray-95); }
.aw-name { font-size:13px; font-weight:700; color:var(--c-slate-50); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0; }
.aw-dots { display:flex; gap:6px; margin:0; padding:0; list-style:none; flex:none; }
.aw-dots li { display:flex; align-items:center; gap:6px; padding:4px 10px 4px 4px; border-radius:999px; background:var(--c-gray-95); color:var(--c-slate-60); font-size:12px; font-weight:700; }
.aw-dots b { display:grid; place-items:center; width:20px; height:20px; border-radius:50%; background:var(--c-gray-99); color:var(--c-slate-60); font-size:11px; }
.aw-dots li.on { background:var(--c-teal-50); color:var(--c-gray-99); }
.aw-dots li.on b { color:var(--c-teal-50); }
.aw-dots li.done { background:var(--c-gray-95); color:var(--c-teal-50); }
.aw-dots li.done b { background:var(--c-teal-55b); color:var(--c-gray-99); }
.aw-body { padding:20px 20px 6px; }
.aw-h { margin:0 0 4px; font-size:21px; line-height:1.25; font-weight:800; color:var(--c-sage-30); letter-spacing:-.01em; }
.aw-sub { margin:0 0 18px; font-size:14px; line-height:1.5; color:var(--c-slate-50); }
.aw-lbl { display:block; margin:16px 0 8px; font-size:13px; font-weight:700; color:var(--c-sage-35); }
.aw-opt { font-weight:500; color:var(--c-slate-70); }
.aw-note { margin:6px 0 0; font-size:12.5px; line-height:1.45; color:var(--c-slate-60); }
.aw-input { width:100%; box-sizing:border-box; height:48px; padding:0 14px; border:1px solid var(--c-gray-90); border-radius:12px; background:var(--c-gray-99); font:inherit; font-size:16px; color:var(--c-sage-30); }
select.aw-input { padding-right:36px; }
.aw-input:focus, .aw-money:focus-within { outline:none; border-color:var(--c-teal-50); background:var(--c-gray-99); box-shadow:0 0 0 3px rgba(var(--c-shadow-rgb), 0.14); }
/* type of account: three tappable rows */
.aw-types { display:grid; gap:8px; }
.aw-type { display:flex; align-items:center; gap:12px; width:100%; padding:13px 14px; border:1px solid var(--c-gray-90); border-radius:14px; background:var(--c-gray-99); text-align:left; font:inherit; cursor:pointer; }
.aw-type strong { display:block; font-size:15px; color:var(--c-sage-30); }
.aw-type small { display:block; margin-top:2px; font-size:12.5px; color:var(--c-slate-60); }
.aw-type.on { border-color:var(--c-teal-50); background:var(--c-gray-95); box-shadow:0 0 0 1px rgba(var(--c-shadow-rgb), 1) inset; }
.aw-radio { flex:none; width:20px; height:20px; border:2px solid var(--c-sage-85); border-radius:50%; }
.aw-type.on .aw-radio { border-color:var(--c-teal-50); box-shadow:inset 0 0 0 4px var(--c-gray-99); background:var(--c-teal-50); }
/* kind of account, already known from the button tapped: one line with Change (2026-10-02) */
.aw-kind { display:flex; align-items:center; gap:12px; margin-bottom:4px; padding:12px 14px; border:1px solid var(--c-gray-90); border-radius:14px; background:var(--c-gray-95); }
.aw-kind > div { flex:1; min-width:0; }
.aw-kind strong { display:block; font-size:15px; color:var(--c-sage-30); }
.aw-kind small { display:block; margin-top:2px; font-size:12.5px; color:var(--c-slate-60); }
.aw .aw-kind-change { flex:none; min-height:0 !important; padding:6px 4px !important; border:0 !important; background:none !important; box-shadow:none !important; font:inherit; font-size:14px; font-weight:700; color:var(--c-teal-50) !important; text-decoration:underline; text-underline-offset:3px; cursor:pointer; }
/* kind of account (2026-10-05): search across all kinds; chips for the kinds of the chosen type */
.aw .aw-kind-q { margin:14px 0 2px; }
.aw-kinds { display:flex; flex-wrap:wrap; gap:8px; }
.aw .aw-kchip { min-height:38px; padding:7px 14px; border:1px solid var(--c-gray-90); border-radius:999px; background:var(--c-gray-99); font:inherit; font-size:14px; font-weight:650; color:var(--c-slate-35); cursor:pointer; }
.aw .aw-kchip.on { border-color:var(--c-teal-50); background:var(--c-gray-95); color:var(--c-teal-50); box-shadow:0 0 0 1px var(--c-teal-50) inset; }
.aw-kind-hits { margin-top:2px; }
.aw-seg { display:flex; padding:4px; border-radius:12px; background:var(--c-gray-95); }
.aw-seg button { flex:1; height:40px; border:0; border-radius:9px; background:none; font:inherit; font-size:14px; font-weight:700; color:var(--c-slate-50); cursor:pointer; }
.aw-seg button.on { background:var(--c-gray-99); color:var(--c-teal-50); box-shadow:0 1px 4px rgba(var(--c-shadow-rgb), 0.12); }
.aw-money { display:flex; align-items:center; gap:6px; height:60px; padding:0 16px; border:1px solid var(--c-gray-90); border-radius:14px; background:var(--c-gray-99); }
.aw-money span { font-size:22px; font-weight:700; color:var(--c-slate-70); }
.aw-money input { flex:1; min-width:0; border:0; background:none; outline:none; font:inherit; font-size:26px; font-weight:800; color:var(--c-sage-30); font-variant-numeric:tabular-nums; }
.aw-money.aw-pct { height:48px; } .aw-money.aw-pct input { font-size:17px; max-width:90px; } .aw-money.aw-pct span { font-size:13px; font-weight:600; }
/* lists */
.aw-list { list-style:none; margin:0 0 14px; padding:0; border:1px solid var(--c-gray-95); border-radius:14px; overflow:hidden; }
.aw-list > li { display:flex; align-items:center; gap:10px; padding:12px 14px; border-top:1px solid var(--c-gray-95); background:var(--c-gray-99); }
.aw-list > li:first-child { border-top:0; }
.aw-f { display:flex; flex-direction:column; min-width:0; flex:1; }
.aw-f strong { font-size:15px; color:var(--c-sage-30); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.aw-f small { font-size:12.5px; color:var(--c-slate-60); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.aw-x { flex:none; width:34px; height:34px; border:0; border-radius:50%; background:var(--c-gray-95); color:var(--c-slate-60); font-size:20px; line-height:1; cursor:pointer; }
.aw-add { padding:14px; border-radius:16px; background:var(--c-gray-99); }
.aw-add .aw-lbl:first-child { margin-top:0; }
.aw-add-row { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.aw-add-row .aw-lbl { margin-top:0; }
.aw-err { margin:6px 0 0; min-height:0; font-size:13px; font-weight:600; color:var(--c-red-50b); }
.aw-err:empty { display:none; }
/* No funds yet (2026-10-03, js/accounts.js): the stock/bond-mix way out, first. */
.aw-mixfirst { display:grid; gap:8px; margin:4px 0 14px; padding:10px 12px; border-radius:12px; background:var(--c-gray-95); font-size:13.5px; color:var(--c-slate-35); }
html body .aw-mixfirst .aw-btn { width:100%; margin:0; background:var(--c-gray-99) !important; color:var(--c-teal-50) !important; border:1px solid var(--c-teal-50) !important; box-shadow:none !important; }
.aw-alts { display:flex; flex-wrap:wrap; align-items:center; gap:4px 14px; margin:14px 0 4px; font-size:13px; color:var(--c-slate-60); }
.aw-textbtn { padding:6px 0; border:0; background:none; color:var(--c-teal-50); font:inherit; font-size:13.5px; font-weight:700; cursor:pointer; }
.aw-mix { padding:18px 16px; border-radius:16px; background:var(--c-gray-99); }
.aw-mix-val { font-size:15px; color:var(--c-slate-45); text-align:center; margin-bottom:12px; }
.aw-mix-val strong { font-size:24px; color:var(--c-sage-30); }
.aw-mix input[type=range], .aw-arow-b input[type=range] { width:100%; accent-color:var(--c-teal-50); }
.aw-mix-ends { display:flex; justify-content:space-between; font-size:12px; color:var(--c-slate-70); }
/* allocation */
.aw-total { padding:14px 16px; border-radius:16px; background:var(--c-gray-99); margin-bottom:12px; }
.aw-total-t { display:flex; align-items:baseline; gap:10px; }
.aw-total-t span { font-size:13px; font-weight:700; color:var(--c-slate-50); }
.aw-total-t strong { font-size:26px; font-weight:800; color:var(--c-sage-30); font-variant-numeric:tabular-nums; }
.aw-total-t em { margin-left:auto; font-style:normal; font-size:13px; font-weight:700; color:var(--c-amber-55b); }
.aw-bar { height:8px; margin-top:10px; border-radius:99px; background:var(--c-gray-95); overflow:hidden; }
.aw-bar i { display:block; height:100%; border-radius:99px; background:var(--c-amber-70); transition:width .15s; }
.aw-total.ok { background:var(--c-gray-95); } .aw-total.ok em { color:var(--c-green-50); } .aw-total.ok .aw-bar i { background:var(--c-green-60); }
.aw-total.over em { color:var(--c-red-50b); } .aw-total.over .aw-bar i { background:var(--c-red-60); }
.aw-conc, .acct-conc { display:block; margin:8px 0 10px; padding:9px 12px; border-radius:10px; background:var(--c-sand-95b); color:var(--c-amber-35); font-size:12.5px; font-weight:500; line-height:1.45; }
.aw-warn { margin:0 0 10px; padding:9px 12px; border-radius:10px; background:rgba(var(--c-amber-55-rgb), .14); color:var(--c-slate-30); font-size:13px; font-weight:600; }
.aw-alist > li { display:block; padding:0; }
.aw-arow-h { display:flex; align-items:center; gap:10px; width:100%; padding:13px 14px; border:0; background:none; text-align:left; font:inherit; cursor:pointer; }
.aw-pctv { flex:none; min-width:52px; text-align:right; font-size:17px; font-weight:800; color:var(--c-sage-30); font-variant-numeric:tabular-nums; }
.aw-edit { flex:none; padding:5px 11px; border-radius:999px; background:var(--c-gray-95); color:var(--c-teal-50); font-size:12.5px; font-weight:700; }
/* still needs a share (only once some share is given, js/accounts.js): amber, not red — it's a to-do, not an error */
.aw-arow.miss { background:rgba(var(--c-amber-55-rgb), .1); box-shadow:inset 3px 0 0 var(--c-amber-55); }
.aw-arow.miss .aw-f small { color:var(--c-orange-65b); }
.aw-arow.open { background:var(--c-gray-99); }
.aw-arow-b { padding:2px 14px 14px; }
.aw-arow-in { display:flex; flex-wrap:wrap; gap:10px; margin-top:8px; }
.aw-arow-in label { display:flex; align-items:center; gap:6px; font-size:13px; font-weight:700; color:var(--c-slate-50); }
.aw-arow-in input { width:92px; height:42px; padding:0 10px; border:1px solid var(--c-gray-90); border-radius:10px; font:inherit; font-size:16px; font-weight:700; color:var(--c-sage-30); }
.aw-arow-in label:nth-child(2) input { width:120px; }
.aw-fname label { flex:1; min-width:0; }
.aw .aw-fname input { flex:1; width:auto; min-width:0; font-weight:600; }
.aw-fname label.aw-ftick { flex:0 0 auto; }
.aw .aw-fname label.aw-ftick input { flex:0 0 auto; width:110px; text-transform:uppercase; }
.aw-fname label:not(.aw-ftick) { flex:1 1 220px; }
@media (max-width: 560px) { .aw-fname label:not(.aw-ftick) { flex:1 1 100%; } .aw-fname label:not(.aw-ftick) input { width:100%; } }
.aw-helpers { display:flex; flex-wrap:wrap; gap:8px; margin:-2px 0 8px; }
.aw-chip { padding:8px 13px; border:1px solid var(--c-gray-90); border-radius:999px; background:var(--c-gray-99); color:var(--c-teal-50); font:inherit; font-size:13px; font-weight:700; cursor:pointer; }
/* footer */
.aw-foot { display:flex; gap:10px; padding:14px 20px 18px; }
.aw-btn { flex:1; min-height:50px; padding:0 16px; border:0; border-radius:14px; background:var(--c-teal-50); color:var(--c-gray-99); font:inherit; font-size:15px; font-weight:800; cursor:pointer; }
.aw-btn:disabled { background:var(--c-gray-85); color:var(--c-gray-99); cursor:not-allowed; }
.aw-btn-q { flex:0 0 auto; background:var(--c-gray-95); color:var(--c-sage-35); }
.aw-btn-2 { width:100%; margin-top:12px; min-height:46px; }
.aw-foot-why { margin:-8px 20px 16px; font-size:12.5px; color:var(--c-slate-60); text-align:center; }
.aw .acct-paste { margin-top:6px; }
@media (max-width:700px){
  .acct-card.aw { margin:6px 0 12px; border-radius:18px; }
  .aw-head { padding:14px 16px 12px; flex-direction:column; align-items:stretch; gap:10px; }
  .aw-dots { justify-content:space-between; }
  .aw-dots li { flex:1; justify-content:center; padding:4px 6px 4px 4px; }
  .aw-body { padding:18px 16px 4px; }
  .aw-foot { padding:12px 16px 16px; position:sticky; bottom:0; background:linear-gradient(rgba(var(--c-gray-99-rgb), 0.85),var(--c-gray-99) 30%); }
  .aw-add-row { grid-template-columns:1fr; gap:0; }
  .aw-add-row > div + div .aw-lbl { margin-top:12px; }
  /* Focus: while an account is open, nothing else on the screen. */
  html.acct-focus #acctManager > :not(.aw), html.acct-focus #acctFooterSlot, html.acct-focus #section01Title,
  html.acct-focus #section01Title + .section-desc, html.acct-focus #liveBar, html.acct-focus #mobileActionBar,
  html.acct-focus .plan-bar, html.acct-focus #planBar, html.acct-focus .aw-hide { display:none !important; }
}
/* The theme's yellow focus ring and green buttons don't belong inside the account steps. */
.aw .aw-money input, .aw .aw-money input:focus { outline:none !important; box-shadow:none !important; border:0 !important; background:none !important; height:auto !important; padding:0 !important; }
.aw .aw-input:focus, .aw .aw-arow-in input:focus { outline:none !important; border-color:var(--c-teal-50) !important; box-shadow:0 0 0 3px rgba(var(--c-shadow-rgb), 0.14) !important; }
.aw .aw-seg button { background:none !important; color:var(--c-slate-50) !important; box-shadow:none !important; min-height:0 !important; }
.aw .aw-seg button.on { background:var(--c-gray-99) !important; color:var(--c-teal-50) !important; box-shadow:0 1px 4px rgba(var(--c-shadow-rgb), 0.12) !important; }
.aw .aw-money input::placeholder { color:var(--c-gray-80); font-weight:600; font-size:20px; }
.aw input:focus-visible, .aw select:focus-visible, .aw textarea:focus-visible { outline:none !important; }
@media (min-width:701px){
  .acct-card.aw { max-width:760px; }
  .aw-body { padding:22px 28px 8px; } .aw-head { padding:16px 28px 14px; }
  .aw-foot { justify-content:flex-end; padding:16px 28px 22px; }
  .aw-foot .aw-btn { flex:0 1 auto; min-width:240px; }
  .aw-foot .aw-btn-q { min-width:0; margin-right:auto; }
  .aw-types { grid-template-columns:repeat(3,1fr); }
  .aw-money { max-width:360px; }
}
@media (max-width:700px){ .acct-manager .acct-progress { display:none; } }
/* The theme (compass-app-theme.css) is a cascade layer, and a layered !important beats an unlayered one:
   the focus-ring override has to live in the same layer (more specific selector wins there). The box
   itself shows focus with its teal border. */
@layer compassAppRefresh {
  .aw .aw-money input:focus-visible, .aw input.aw-input:focus-visible, .aw select.aw-input:focus-visible, .aw .aw-arow-in input:focus-visible { outline:none !important; }
}

/* QA 2026-09-27: step 2's Current Balance when it's the total of the pre-tax accounts (read-only). */
@layer compassAppRefresh {
  html body input.is-derived { background:var(--c-gray-95) !important; color:var(--c-slate-35) !important; cursor:default; }
}
/* Mix-only account on the funds step (2026-09-30): what adding a fund does, and the way back to a kept fund list. */
.aw-mixnote { margin:0 0 14px; padding:12px 14px; border-radius:12px; background:var(--c-gray-95); }
.aw-mixnote p { margin:0 0 8px; font-size:13.5px; line-height:1.5; color:var(--c-slate-45); }
.aw-mixnote p:last-child { margin-bottom:0; }
.aw-mixnote .aw-btn { width:100%; }
/* A fund just added (2026-09-30): the list gets a heading and the new row a short "✓ Added" highlight. */
.aw-list-h { margin:0 0 6px; font-size:12.5px; font-weight:700; letter-spacing:.02em; text-transform:uppercase; color:var(--c-slate-60); }
.aw-list-h b { display:inline-block; min-width:20px; margin-left:4px; padding:1px 7px; border-radius:999px; background:var(--c-sage-90); color:var(--c-sage-30); text-align:center; }
.aw-list > li.aw-new { background:var(--c-sage-95); box-shadow:inset 4px 0 0 var(--c-green-45); animation:aw-new-in .45s ease-out; }
.aw-added { display:inline-block; margin-left:8px; padding:2px 8px; border-radius:999px; background:var(--c-green-45); color:var(--c-gray-99); font-size:11.5px; font-style:normal; font-weight:700; vertical-align:2px; }
@keyframes aw-new-in { from { transform:translateY(-6px); opacity:.2; } to { transform:none; opacity:1; } }
@media (prefers-reduced-motion: reduce) { .aw-list > li.aw-new { animation:none; } }
.aw-sr { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; margin:0; }

/* Funds step, 2026-10-02: added funds stand out, one clear "Add another fund", fee always shown. */
.aw-list { border-color:var(--c-gray-90); }
.aw-list > li { padding:14px; }
.aw-list .aw-f strong { font-size:16px; color:var(--c-sage-30); }
.aw-fchk { flex:none; display:inline-flex; align-items:center; justify-content:center; width:26px; height:26px; border-radius:50%; background:var(--c-teal-50); color:var(--c-gray-99); font-size:14px; font-weight:800; }
.aw-list-h { font-size:14px; color:var(--c-sage-30); }
.aw .aw-feewarn { display:block; margin-top:4px; white-space:normal; color:var(--c-amber-35); font-weight:600; }
.aw .aw-addmore { display:block; width:100%; min-height:52px; margin:0 0 4px; padding:0 16px; border:2px dashed var(--c-teal-50) !important; border-radius:14px; background:var(--c-gray-99) !important; color:var(--c-teal-50) !important; box-shadow:none !important; font:inherit; font-size:15px; font-weight:700; cursor:pointer; }
.aw-add-h2 { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin:4px 0 8px; font-size:15px; font-weight:700; color:var(--c-sage-30); }

/* Retirement details, 2026-10-02: a visible line saying where a filled-in number comes from. */
.fld-source { margin:6px 0 0; font-size:12.5px; line-height:1.45; color:var(--c-slate-60); }
.fld-source[hidden] { display:none; }
.acct-switch-notice { position:fixed; left:50%; top:80px; transform:translateX(-50%); z-index:9999; max-width:min(560px, calc(100vw - 32px)); padding:12px 16px; border-radius:12px; background:var(--c-gray-99); color:var(--c-slate-25); border:1px solid var(--c-amber-75); box-shadow:0 8px 24px rgba(var(--c-shadow-rgb), 0.18); font-size:14px; line-height:1.45; }
.acct-switch-notice[hidden] { display:none; }
html body .fld-source-link { display:inline; min-height:0; padding:0; border:0; background:none; box-shadow:none; font:inherit; font-weight:700; color:var(--c-teal-50); text-decoration:underline; text-underline-offset:2px; cursor:pointer; }

/* Account tiles (2026-10-03): Total alone, or Total + each kind you have — as many columns as tiles. */
html body .acct-tiles { grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); }
.acct-add-h { margin:6px 0 8px; font-size:13px; font-weight:800; color:var(--c-slate-35); }

/* Cash interest rate quick choices (2026-10-04) */
.cash-rate-pick { display:flex; flex-wrap:wrap; gap:6px; margin-top:6px; }
.cash-rate-btn { min-height:30px; padding:3px 10px; border:1px solid var(--c-gray-90); border-radius:999px; background:var(--c-gray-99); color:var(--c-teal-40); font:inherit; font-size:12px; font-weight:600; cursor:pointer; }
.cash-rate-btn:hover { border-color:var(--c-teal-50); }

/* All your money (js/40, 2026-10-04) */
.mm { margin:0 0 16px; }
.mm[hidden] { display:none; }
.mm-head { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; }
.mm-head h3 { margin:0; font-size:17px; color:var(--c-slate-25); }
.mm-sub { margin:4px 0 0; font-size:12.5px; color:var(--c-slate-55); }
.mm-total { font-size:22px; font-weight:800; color:var(--c-slate-25); white-space:nowrap; }
.mm-facts { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)) minmax(0,2.2fr); gap:8px; margin:12px 0 8px; }
.mm-facts > div { padding:8px 10px; border:1px solid var(--c-gray-90); border-radius:12px; background:var(--c-gray-99); }
.mm-facts span { display:block; font-size:11px; font-weight:700; color:var(--c-slate-55); text-transform:uppercase; letter-spacing:.03em; }
.mm-facts b { font-size:17px; color:var(--c-slate-25); }
.mm-facts em { display:block; font-style:normal; font-size:12px; color:var(--c-slate-45); margin-top:2px; }
.mm-notes p { margin:6px 0; padding:8px 12px; border-radius:10px; background:var(--c-sand-95b); color:var(--c-amber-35); font-size:12.5px; }
.mm-views { margin:8px 0 4px; }
.mm-body { display:grid; grid-template-columns:minmax(220px, 300px) 1fr; gap:16px; align-items:center; }
.mm-chart { position:relative; height:280px; }
.mm-keys { display:flex; flex-direction:column; gap:4px; }
.mm-key { display:grid; grid-template-columns:12px 1fr auto 44px; align-items:center; gap:8px; min-height:34px; padding:4px 10px; border:1px solid transparent; border-radius:10px; background:transparent; font:inherit; font-size:13px; color:var(--c-slate-30); text-align:left; cursor:pointer; }
.mm-key:hover { background:var(--c-gray-95); }
.mm-key.is-on { border-color:var(--c-teal-50); background:var(--c-gray-99); }
.mm-key i { width:12px; height:12px; border-radius:3px; }
.mm-key b { font-variant-numeric:tabular-nums; }
.mm-key em { font-style:normal; font-size:12px; color:var(--c-slate-55); text-align:right; }
.mm-detail { margin-top:10px; }
.mm-d-head { display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px; padding:8px 0; border-top:1px solid var(--c-gray-90); }
.mm-d-head i { width:12px; height:12px; border-radius:3px; }
.mm-d-head strong { color:var(--c-slate-25); }
.mm-d-head span { font-size:12.5px; color:var(--c-slate-55); }
.mm-list { list-style:none; margin:0; padding:0; }
.mm-list li { display:flex; justify-content:space-between; gap:12px; padding:8px 0; border-top:1px solid var(--c-gray-95); }
.mm-l-name { font-size:13.5px; color:var(--c-slate-30); }
.mm-l-name small, .mm-l-amt small { display:block; font-size:11.5px; color:var(--c-slate-55); }
.mm-l-amt { text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; }
.mm-hint { margin:8px 0 0; font-size:12.5px; color:var(--c-slate-55); }
@media (max-width:640px){
  .mm-facts { grid-template-columns:repeat(3, minmax(0,1fr)); }
  .mm-facts .mm-risk { grid-column:1 / -1; }
  .mm-body { grid-template-columns:1fr; }
  .mm-chart { height:240px; }
}
/* the key buttons are toggles in the themes' sense too: keep them plain (see .cfj-key in compass-dashboard.css) */
@layer compassNavTop { :root .mm-keys button.mm-key.mm-key[aria-pressed] { background:transparent !important; color:var(--c-slate-30) !important; box-shadow:none !important; } :root .mm-keys button.mm-key.mm-key.is-on { background:var(--c-gray-99) !important; border-color:var(--c-teal-50) !important; } :root .mm-keys button.mm-key.mm-key[aria-pressed] * { color:inherit !important; } :root .mm-keys button.mm-key.mm-key[aria-pressed] em { color:var(--c-slate-55) !important; } }

/* All your money as the accounts overview (2026-10-04): Edit / Delete beside each account and fund */
.mm-krow { display:flex; align-items:center; gap:6px; }
.mm-krow .mm-key { flex:1 1 auto; min-width:0; }
.mm-acts { display:inline-flex; flex-wrap:wrap; gap:4px; margin-left:auto; }
.mm-act { min-height:30px; padding:3px 10px; border:1px solid var(--c-gray-90); border-radius:999px; background:var(--c-gray-99); color:var(--c-teal-40); font:inherit; font-size:12px; font-weight:700; cursor:pointer; white-space:nowrap; }
.mm-act:hover { border-color:var(--c-teal-50); }
.mm-act.mm-del { color:var(--c-red-45); }
.mm-act.mm-del:hover { border-color:var(--c-red-45); }
.mm-d-head .mm-acts { margin-left:auto; }
.mm-list li { align-items:center; }
.mm-l-name { flex:1 1 auto; min-width:0; }
.mm-l-act { flex:none; }
.mm-attn { margin:8px 0; padding:8px 12px; border:1px solid var(--c-amber-70); border-radius:12px; background:var(--c-sand-95b); font-size:13px; color:var(--c-slate-30); }
.mm-attn > strong { display:block; margin-bottom:4px; color:var(--c-amber-35); }
.mm-attn-row { display:flex; justify-content:space-between; align-items:center; gap:10px; padding:4px 0; }
@media (max-width:640px){
  .mm-krow.has-acts { flex-wrap:wrap; }
  .mm-krow.has-acts .mm-key { flex-basis:100%; }
  .mm-krow.has-acts .mm-acts { margin:0 0 6px 30px; }
  .mm-list li { flex-wrap:wrap; }
  .mm-l-act { flex-basis:100%; }
}

/* The money map's lists in aligned columns (2026-10-04): name · amount · button, the same widths on every row */
.mm-list li { display:grid; grid-template-columns:minmax(0,1fr) 150px 92px; align-items:center; column-gap:14px; }
.mm-l-amt { text-align:right; }
.mm-l-act { justify-self:end; }
.mm-l-act .mm-act { min-width:76px; text-align:center; }
.mm-list li:not(:has(.mm-l-act)) { grid-template-columns:minmax(0,1fr) 150px; }
@media (max-width:640px){
  .mm-list li { grid-template-columns:minmax(0,1fr) auto; row-gap:6px; }
  .mm-l-name { grid-column:1 / -1; }
  .mm-l-amt { text-align:left; }
  .mm-l-act { flex-basis:auto; }
}
.mm-krow.has-acts .mm-acts { width:150px; justify-content:flex-end; flex-wrap:nowrap; }
.mm-krow .mm-act { min-width:68px; text-align:center; }
@media (max-width:640px){ .mm-krow.has-acts .mm-acts { width:auto; justify-content:flex-start; } }

/* whose account (2026-10-04) */
.mm-who { display:inline-block; margin-left:6px; padding:1px 7px; border-radius:999px; background:var(--c-gray-95); color:var(--c-slate-45); font-size:11px; font-weight:700; vertical-align:1px; white-space:nowrap; }
.mm-who.is-spouse { background:var(--c-sand-95b); color:var(--c-amber-35); }
@layer compassNavTop { :root .mm-keys button.mm-key.mm-key[aria-pressed] .mm-who { color:var(--c-slate-45) !important; } :root .mm-keys button.mm-key.mm-key[aria-pressed] .mm-who.is-spouse { color:var(--c-amber-35) !important; } }

/* Phones (2026-10-04): one line per account with Edit (Delete is in the account's own list), the stock/bond/cash mix as
   one line, and "How your accounts combine" folded into a link everywhere. */
.mm-mixline { display:none; margin:10px 0 6px; font-size:14px; color:var(--c-slate-35); }
.mm-mixline b { color:var(--c-slate-25); font-size:16px; }
.acct-blend { margin-top:14px; font-size:13px; }
.acct-blend > summary { cursor:pointer; color:var(--c-teal-40); font-weight:700; }
.acct-blend:has(#blendPortfoliosPanel[style*="display: none"]), .acct-blend:has(#blendPortfoliosPanel[style*="display:none"]) { display:none; }
.acct-blend #blendPortfoliosPanel { margin-top:8px !important; padding-top:0 !important; border-top:0 !important; }
@media (max-width:640px){
  .mm-mixline { display:block; }
  .mm-facts { grid-template-columns:1fr; margin-top:0; }
  .mm-facts > div:not(.mm-risk) { display:none; }
  .mm-krow.has-acts { flex-wrap:nowrap; align-items:center; }
  .mm-krow.has-acts .mm-key { flex:1 1 auto; flex-basis:auto; }
  .mm-krow.has-acts .mm-acts { width:auto; margin:0; }
  .mm-krow.has-acts .mm-del { display:none; }
  /* one line in every view: name (its tag wraps under it if there's no room) · amount · % · then Edit */
  .mm-krow .mm-key { grid-template-columns:12px minmax(0,1fr) auto 36px; column-gap:8px; padding:6px 8px; }
  .mm-krow .mm-key span { line-height:1.3; }
  .mm-krow .mm-key .mm-who { margin-left:0; margin-top:2px; }
  .mm-krow.has-acts .mm-acts { width:72px; flex:none; }
  .mm-krow.has-acts .mm-acts .mm-act:not(.mm-del) { width:100%; min-width:0; padding:3px 6px; }
}

/* Zebra rows (2026-10-04): a faint band on every other row so the eye follows a name across to its amount — the slice
   lists (All your money, the Expense Planner's Where the money goes) and the lists of what's in a slice. */
.mm-keys > :nth-child(even), .mm-list li:nth-child(even) { background:rgba(var(--c-slate-55b-rgb), 0.06); }
.mm-keys > * { border-radius:10px; }
.mm-list li { padding-left:8px; padding-right:8px; border-radius:8px; }
.mm-list li + li { border-top-color:transparent; }
@layer compassNavTop { :root .mm-keys > button.mm-key.mm-key:nth-child(even)[aria-pressed] { background:rgba(var(--c-slate-55b-rgb), 0.06) !important; } :root .mm-keys > button.mm-key.mm-key.is-on[aria-pressed] { background:var(--c-gray-99) !important; } }

/* Target-date fund controls in the account editor (2026-10-04) */
.aw-td { margin-top:8px; padding:8px 10px; border-radius:10px; background:rgba(var(--c-slate-55b-rgb), 0.06); }
.aw-td select { margin-left:6px; min-height:32px; }
.mm-notes .mm-act { margin-left:6px; }

/* Brokerage: the 0% capital-gains choice on the account (2026-10-05) */
.aw-check{display:flex;align-items:flex-start;gap:8px;margin:14px 0 2px;font-size:14px;font-weight:600;color:inherit;cursor:pointer}
.aw-check input{margin-top:3px;flex:none}

/* Spouse & Household: their accounts instead of balance fields (2026-10-05). The old fields stay hidden for the engine. */
html body .sp-moved { display:none !important; }
.sp-accts { margin:4px 0 16px; padding:12px 14px; border:1px solid var(--c-gray-90); border-radius:12px; font-size:14px; line-height:1.45; }
.sp-accts p { margin:0 0 8px; color:var(--c-slate-60); }
.sp-accts-h { display:flex; justify-content:space-between; gap:12px; margin-bottom:6px; font-weight:600; }
.sp-accts ul { list-style:none; margin:0 0 10px; padding:0; }
.sp-accts li { display:flex; align-items:baseline; gap:12px; padding:6px 0; border-top:1px solid var(--c-gray-90); }
.sp-accts li > span:first-child { flex:1; min-width:0; }
.sp-accts li small { margin-left:6px; color:var(--c-slate-60); }
/* "+ Add this fund" is the step's main action; "Delete account" is in the account's header at every step (2026-10-10) */
.aw-add { display:block; width:100%; flex:none; margin-top:14px; min-height:50px; }
.aw-del { flex:none; margin-left:8px; padding:6px 4px; border:0; background:none; color:var(--c-red-45); font:inherit; font-size:13px; font-weight:600; cursor:pointer; text-decoration:underline; text-underline-offset:3px; }
.aw-del:hover { color:var(--c-red-40); }
@media (max-width:700px){ .aw-del { align-self:flex-end; margin:0; } }
/* Accounts pass (2026-10-10): yearly savings, update balances, notes, the moved-accounts notice */
.aw-contrib { max-width:360px; } .aw-contrib input { max-width:none !important; }
.mm-head-r { display:flex; flex-direction:column; align-items:flex-end; gap:8px; }
.mm-upd-btn { white-space:nowrap; }
.mm-upd { margin:12px 0 4px; padding:14px 16px; border:1px solid var(--c-gray-90); border-radius:14px; background:var(--c-gray-99); }
.mm-upd-h { margin:0 0 10px; font-size:13.5px; color:var(--c-slate-45); line-height:1.5; } .mm-upd-h b { color:var(--c-slate-25); }
.mm-upd-rows { display:flex; flex-direction:column; gap:8px; }
.mm-upd-row { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) auto; gap:10px; align-items:center; padding:6px 0; border-bottom:1px solid var(--c-gray-95); }
.mm-upd-n { display:flex; flex-direction:column; min-width:0; } .mm-upd-n b { font-size:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .mm-upd-n small { font-size:12px; color:var(--c-slate-55); }
.mm-upd-date { display:flex; align-items:center; gap:6px; font-size:12.5px; color:var(--c-slate-55); } .mm-upd-date input { min-height:40px; }
.mm-upd-acts { display:flex; gap:8px; margin-top:12px; }
.mm-stale, .mm-saving { margin:8px 0; font-size:13px; color:var(--c-slate-40); line-height:1.5; }
.mm-stale { padding:8px 12px; border:1px solid var(--c-amber-70); border-radius:12px; background:var(--c-sand-95b); color:var(--c-amber-35); }
.mm-link { padding:0; border:0; background:none; color:var(--c-blue-50); font:inherit; font-weight:600; cursor:pointer; text-decoration:underline; text-underline-offset:3px; }
.mm-part { font-style:normal; font-weight:500; color:var(--c-slate-45); }
.acct-switch-notice { top:auto !important; bottom:calc(140px + env(safe-area-inset-bottom)); display:flex; align-items:flex-start; gap:10px; }
.acct-switch-notice[hidden] { display:none !important; }
.acct-switch-x { flex:none; width:28px; height:28px; margin:-4px -6px 0 0; border:0; border-radius:8px; background:none; color:var(--c-slate-55); font-size:20px; line-height:1; cursor:pointer; }
@media (max-width:700px){
  .mm-head-r { align-items:flex-start; }
  .mm-upd-row { grid-template-columns:minmax(0,1fr) minmax(0,1fr); } .mm-upd-n { grid-column:1 / -1; }
  .acct-switch-notice { bottom:calc(170px + env(safe-area-inset-bottom)); }
}
.aw .aw-seg button[aria-pressed] .aw-seg-sub, .aw-seg button .aw-seg-sub { display:block; margin-top:2px; font-size:12px; font-weight:500; opacity:.8; line-height:1.3; color:inherit !important; }
.aw-seg button:has(.aw-seg-sub) { height:auto !important; min-height:48px; padding-top:6px !important; padding-bottom:6px !important; }
.mm-upd-date span { white-space:nowrap; }
/* What each account adds each year (2026-10-11): beside its name in the list, the household's total under the chart,
   and a note when someone is over the year's limit (js/40, js/accounts). */
.mm-add { display:inline-block; margin-left:6px; font-size:11.5px; font-weight:700; color:var(--c-green-45); white-space:nowrap; }
.mm-over { margin:6px 0; padding:8px 12px; border-radius:10px; background:var(--c-sand-95b); color:var(--c-amber-35); font-size:12.5px; line-height:1.5; }
.aw-over { color:var(--c-amber-35); }

/* ---------------------------------------------------------------- Savings, the workflow (2026-10-14; user picked A in the Savings
   review, keeping the chart): the open account under its own row of All your money; one "+ Add an account" with what each kind
   is; a brokerage's tax questions in their own part; find a fund by name or ticker. */
.mm-body:has(.acct-card.aw-inrow) { align-items:start; } /* the chart stays at the top beside an open account */
.mm-body:has(.acct-card.aw-inrow) .mm-chart { position:sticky; top:150px; }
.mm-krow.mm-editing { background:var(--c-gray-95); border-radius:10px 10px 0 0; }
.mm-krow.mm-editing .mm-acts { visibility:hidden; } /* its Edit is the open account below */
#mmKeys > .acct-card.aw.aw-inrow { margin:0 0 10px; border-radius:0 0 14px 14px; border-top:0; }
.acct-add { margin-top:14px; }
.acct-add-btn { display:flex; align-items:center; width:100%; min-height:48px; padding:0 16px; border:1px dashed var(--c-gray-75); border-radius:12px; background:var(--panel); font:inherit; font-size:15px; font-weight:600; color:var(--c-teal-40); cursor:pointer; }
.acct-add-btn:hover, .acct-add-btn[aria-expanded="true"] { border-style:solid; border-color:var(--c-teal-40); }
.acct-kinds { display:grid; grid-template-columns:repeat(auto-fill, minmax(220px, 1fr)); gap:8px; margin-top:10px; }
.acct-kinds[hidden] { display:none; }
.acct-kind { display:flex; flex-direction:column; align-items:flex-start; gap:2px; min-height:56px; padding:10px 12px; border:1px solid var(--c-gray-85); border-radius:12px; background:var(--panel); font:inherit; text-align:left; cursor:pointer; color:var(--c-slate-25); }
.acct-kind:hover { border-color:var(--c-teal-40); }
.acct-kind b { font-size:15px; }
.acct-kind span { font-size:13.5px; color:var(--c-slate-55); }
.aw-part-h { margin:22px 0 0; padding-top:14px; border-top:1px solid var(--c-gray-90); font-size:15px; font-weight:700; color:var(--c-slate-25); }
.aw-part-h + .aw-lbl { margin-top:10px; }
.aw-hits { display:flex; flex-direction:column; margin-top:6px; border:1px solid var(--c-gray-85); border-radius:12px; background:var(--panel); overflow:hidden; }
.aw-hits[hidden] { display:none; }
.aw-hit { display:grid; grid-template-columns:auto 1fr; gap:0 10px; align-items:baseline; min-height:44px; padding:8px 12px; border:0; border-top:1px solid var(--c-gray-90); background:transparent; font:inherit; text-align:left; cursor:pointer; color:var(--c-slate-25); }
.aw-hit:first-child { border-top:0; }
.aw-hit:hover, .aw-hit:focus-visible { background:var(--c-gray-95); }
.aw-hit b { font-size:14.5px; }
.aw-hit span { font-size:14.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.aw-hit small { grid-column:2; font-size:13px; color:var(--c-slate-55); }
.aw-hits > .aw-note { margin:0; padding:10px 12px; }
.aw-or { margin-bottom:6px; }

/* the small boxes' placeholders at the typed size (2026-10-15, user: "why are these place holders so big?" — 20px over 17px values) */
.aw .aw-money.aw-pct input::placeholder { font-size:inherit; font-weight:500; }
/* Read a PDF statement (2026-10-15, js/accounts.js readPdf): what it found, or why not; the privacy line */
.acct-pdf-busy { color:var(--c-slate-45); }
.acct-pdf-ok { color:var(--c-green-35); font-weight:600; }
.acct-pdf-warn { color:var(--c-amber-35); font-weight:600; }
.acct-pdf-priv { margin-top:4px; font-size:12.5px; color:var(--c-slate-55); }
/* the holdings it read fit the editor: fixed columns, names and notes wrap (2026-10-15) */
.acct-paste-table { width:100%; table-layout:fixed; }
.acct-paste-table th:nth-child(1), .acct-paste-table td:nth-child(1) { width:72px; }
.acct-paste-table th:nth-child(3), .acct-paste-table td:nth-child(3) { width:96px; }
.acct-paste-table th:nth-child(4), .acct-paste-table td:nth-child(4) { width:34%; }
.acct-paste-table td, .acct-paste-table td .acct-note { white-space:normal !important; overflow-wrap:anywhere; }
.acct-paste-table td select { width:100%; max-width:100%; }
.acct-paste-table th:nth-child(5), .acct-paste-table td:nth-child(5) { width:52px; } /* one fund out (2026-10-15) */
.acct-paste-table td:nth-child(5) .ib-del { font-size:0; }
/* the review list on a phone (2026-10-15): one fund per block — ticker and trash on top, then its name, share and kind */
@media (max-width:640px){
  .acct-paste-table, .acct-paste-table tbody { display:block; }
  .acct-paste-table thead { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
  .acct-paste-table tr { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:4px 12px; padding:12px 0; border-bottom:1px solid var(--c-gray-95); }
  .acct-paste-table td { display:block; width:auto !important; padding:0 !important; border:0 !important; }
  .acct-paste-table td:nth-child(1) { grid-column:1; grid-row:1; align-self:center; font-weight:600; }
  .acct-paste-table td:nth-child(5) { grid-column:2; grid-row:1; }
  .acct-paste-table td:nth-child(2), .acct-paste-table td:nth-child(3), .acct-paste-table td:nth-child(4) { grid-column:1 / -1; }
}