/* Bureo shell M1: the boards of app/m1-board.js on the kit's tokens: the Bank (#m1Bank, study screen "bank") and the Overview's
   declutter pieces (#m1Board). Signed in the Bank board carries gw.js's actions: "Import a statement" (data-gwa="bk-import", in the
   summary row) and the per-row Match of a suggestion (data-gwa="bk-match", after its dot pill). Both are the study's quiet link (.k-lnk).
   The transactions are M1 rows (owner 14.10; the .m1-btx block at the end of this file), no table. */
html.b-m1 #m1Bank .k-lnk{cursor:pointer}
html.b-m1 #m1Bank .k-lnk:hover{color:var(--k-text)}
html.b-m1 #m1Bank .k-lnk:disabled{opacity:.5;cursor:default}
html.b-m1 #m1Bank .m1-bmatch{margin-left:8px}
html.b-m1 #m1Bank .m1-bimp{white-space:nowrap}
html.b-m1 #m1Bank .m1-brow{margin-top:8px}
@media (max-width:860px){
  html.b-m1 #m1Bank .k-lnk{min-height:var(--k-tap);display:inline-flex;align-items:center}
  html.b-m1 #m1Bank .m1-bmatch{margin:0}
}
/* signed in, the page shows only gw.js's cards (index.html: #main>section[data-gwlive]>:not(.gw-live){display:none!important});
   the board is the one exception, since it carries their actions (Rules still shows gw.js's own list) */
html.b-m1:not(.m1-chrome):not(.m1-otable) #main>section[data-gwlive]>#m1Bank{display:flex!important}

/* ---------- the Overview board (#m1Board) and Money (m1-money.js): the declutter layout ----------
   above the fold the hero + two tiles: on the desk the two stack beside the hero (each across two columns), on a phone they sit
   side by side under it; the tiles in the fold ("More on this page · N", kit details.k-more) are a plain two-column row */
@media (min-width:761px){
  html.b-m1 .k-kts.m1-kts3>.k-kt:not(.k-hero){grid-column:span 2}
  html.b-m1 .k-kts.m1-kts2{grid-template-columns:repeat(2,minmax(0,1fr))}
}
html.b-m1 .k-kts.m1-krest{grid-template-columns:repeat(2,minmax(0,1fr))}
html.b-m1 .k-more.m1-more>summary{margin:0 4px}
html.b-m1 .k-more.m1-more>.m1-morein{margin-top:6px}
/* one lime per view: when the chat is talking about a tile (its lime ring, k-ref), the bars' lit period steps back to ink */
html.b-m1 .k-dash:has(.k-kt.k-ref) .k-bx.k-hi,html.b-m1 .k-dash:has(.k-kt.k-ref) .k-lgd i.k-hi{background:var(--k-text)}
/* Connect a bank (app/bank-connect.js): one sheet, desk = a centred card, phone = a bottom sheet. Kit tokens with fallbacks, so
   the classic shell gets it too. */
dialog.bc{--bc-bg:var(--k-surface,#fff);--bc-tx:var(--k-text,#0B0B0C);--bc-t2:var(--k-text-2,#5E636A);--bc-ln:var(--k-line,#E6E8EB);--bc-s2:var(--k-surface-2,#F5F6F7);
  border:0;padding:0;margin:auto;width:min(560px,calc(100vw - 32px));max-height:min(760px,calc(100vh - 48px));border-radius:var(--k-r-card,20px);background:var(--bc-bg);color:var(--bc-tx);
  box-shadow:var(--k-sh-3,0 30px 70px -20px rgba(20,22,30,.45));font-family:var(--k-font,inherit);overflow:hidden;display:flex;flex-direction:column}
dialog.bc:not([open]){display:none}
/* the «Bank connections» view (M1 shell slot): the same words and colours as the sheet, no sheet chrome; the shell draws the big
   title and the subtitle above it (owner rule: one big title per screen) */
.bc-view{--bc-bg:var(--k-surface,#fff);--bc-tx:var(--k-text,#0B0B0C);--bc-t2:var(--k-text-2,#5E636A);--bc-ln:var(--k-line,#E6E8EB);--bc-s2:var(--k-surface-2,#F5F6F7);
  color:var(--bc-tx);font-family:var(--k-font,inherit);max-width:720px}
html[data-theme="dark"] .bc-view{--bc-bg:var(--k-surface,#151517);--bc-tx:var(--k-text,#F2F3F5);--bc-t2:var(--k-text-2,#B4B8BE);--bc-ln:var(--k-line,#26262A);--bc-s2:var(--k-surface-2,#1E1E21)}
.bc-view .bc-body{padding:4px 0 24px;overflow:visible}
.bc-view .k-input{height:44px;border-radius:12px;border:1px solid var(--bc-ln);background:var(--bc-s2);color:inherit;padding:0 12px;font:inherit;font-size:15px}
.bc-view .k-btn{min-height:40px}
.bc-view .bc-backl{display:inline-flex;margin:0 0 6px}
dialog.bc::backdrop{background:var(--k-scrim,rgba(11,11,12,.35))}
html[data-theme="dark"] dialog.bc{--bc-bg:var(--k-surface,#151517);--bc-tx:var(--k-text,#F2F3F5);--bc-t2:var(--k-text-2,#B4B8BE);--bc-ln:var(--k-line,#26262A);--bc-s2:var(--k-surface-2,#1E1E21)}
.bc-head{display:flex;align-items:center;gap:8px;padding:18px 20px 10px}
.bc-head h2{flex:1;margin:0;font-size:19px;font-weight:600;letter-spacing:-.01em}
.bc-ib{width:36px;height:36px;border-radius:50%;border:0;background:var(--bc-s2);color:inherit;font-size:20px;line-height:1;cursor:pointer}
.bc-body{padding:4px 20px 20px;overflow:auto;display:flex;flex-direction:column;gap:12px;min-height:0}
.bc-find{display:flex;gap:8px}
.bc-q{flex:1;min-width:0}
.bc-cc{flex:0 0 auto;max-width:42%}
dialog.bc .k-input{height:44px;border-radius:12px;border:1px solid var(--bc-ln);background:var(--bc-s2);color:inherit;padding:0 12px;font:inherit;font-size:15px}
.bc-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.bc-bank{width:100%;display:flex;align-items:center;gap:12px;padding:10px 8px;border:0;border-radius:12px;background:transparent;color:inherit;font:inherit;text-align:left;cursor:pointer;min-height:56px}
.bc-bank:hover,.bc-bank:focus-visible{background:var(--bc-s2)}
.bc-logo{width:36px;height:36px;flex:none}
.bc-logo{background:var(--k-surface-3,#EEF0F2)}
.bc-logo img{width:100%;height:100%;object-fit:contain}
.bc-bn{flex:1;min-width:0;display:flex;flex-direction:column}
.bc-bn b{font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bc-bn small{color:var(--bc-t2);font-size:13px}
.bc-sec{font-size:12px;color:var(--bc-t2);white-space:nowrap}
.bc-secl{text-align:center}
.bc-lnk{align-self:flex-start;border:0;background:none;color:var(--bc-t2);text-decoration:underline;font:inherit;font-size:14px;cursor:pointer;padding:4px 0}
.bc-faint{color:var(--bc-t2);margin:0;font-size:14px}
.bc-lead{margin:0;font-size:15px;line-height:1.5}
.bc-err{margin:0;color:var(--k-warn-ink,#B4461A);font-size:14px}
.bc-ok{margin:0;color:var(--k-ok-ink,#167A45);font-size:14px}
.bc-soon{margin:0;font-size:13px;color:var(--bc-t2)}
.bc-opt{display:flex;flex-direction:column;gap:6px;align-items:flex-start;text-align:left;padding:14px;border:1px solid var(--bc-ln);border-radius:14px;background:transparent;color:inherit;font:inherit;cursor:pointer}
div.bc-opt{cursor:default}
.bc-opt small{color:var(--bc-t2);font-size:13px;line-height:1.45}
.bc-addr{display:flex;gap:8px;align-items:center;flex-wrap:wrap;max-width:100%}
.bc-addr code{font-size:13px;word-break:break-all;background:var(--bc-s2);padding:6px 8px;border-radius:8px}
.bc-center{align-items:center;text-align:center;padding-top:12px}
.bc-hop{display:flex;align-items:center;gap:14px;margin:8px 0}
.bc-hop .bc-logo{width:48px;height:48px}
.bc-dots{color:var(--bc-t2);letter-spacing:4px}
.bc-go{text-decoration:none}
.bc-spin{display:inline-block;vertical-align:-2px}
.bc-acts{display:flex;gap:8px;flex-wrap:wrap}
.bc-acct,.bc-feed{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--bc-ln)}
.bc-feed{flex-direction:column;align-items:stretch}
.bc-frow{display:flex;align-items:center;gap:10px}
dialog.bc .k-btn{min-height:40px}
.bc-card{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.bc-card p{flex:1;min-width:200px;margin:0}
@media (max-width:640px){
  dialog.bc{width:100vw;max-width:100vw;max-height:92vh;margin:auto 0 0;border-radius:24px 24px 0 0}
  .bc-body{padding-bottom:max(20px,env(safe-area-inset-bottom))}
}
.bc-h3{margin:4px 0 0;font-size:14px;font-weight:600;color:var(--bc-t2)}
.bc-line{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--bc-ln);flex-wrap:wrap}
.bc-amt{font-variant-numeric:tabular-nums;font-weight:500;white-space:nowrap}
.bc-amt.bc-out{color:var(--bc-t2)}
@media (max-width:640px){.bc-line .k-spill{margin-left:auto}.bc-bank .bc-sec{display:none}}
/* Money's proactive bank card (m1-money.js): a quiet strip above the tiles */
.m1m-nudge{padding:12px 16px;border-radius:var(--k-r-card,20px);background:var(--k-card,var(--k-surface,#fff));border:1px solid var(--k-line,#E6E8EB);margin:0 0 12px;font-size:var(--k-t-sm,14px)}
.m1m-nudge[data-kind="expired"],.m1m-nudge[data-kind="error"]{border-color:var(--k-warn,#E8642C)}
/* HQ 34 shots review: one accent (no per-row pills), visibly demo, coming soon, phone type ≥ 14 px, wrapping, the composer stays visible */
.bc-demo{font-size:12px;font-weight:600;letter-spacing:.02em;text-transform:uppercase;padding:3px 8px;border-radius:999px;border:1px solid var(--bc-ln);color:var(--bc-t2)}
.bc-soonrow .bc-logo{opacity:.55}
.bc-soonrow b{color:var(--bc-t2)}
.bc-bn small+small{margin-top:1px}
.bc-st{color:var(--bc-t2)}
.bc-st.bc-done::before{content:'✓ ';color:var(--bc-tx)}
.bc-warn{color:var(--k-warn-ink,#B4461A)!important}
.bc-bn b,.bc-bn small{white-space:normal;overflow-wrap:anywhere}
.bc-line{flex-wrap:nowrap;align-items:flex-start}
.bc-line .bc-amt{margin-left:auto;padding-left:8px}
.bc-addr{flex-wrap:nowrap}
.bc-addr code{flex:1;min-width:0}
.bc-addr .k-btn{flex:none}
@media (max-width:640px){
  dialog.bc{margin:auto 0 var(--bc-above,96px);max-height:calc(100dvh - var(--bc-above,96px) - 56px);border-radius:24px}
  .bc-bn small,.bc-faint,.bc-opt small,.bc-soon,.bc-addr code,.bc-h3,.bc-lnk{font-size:14px}
  .bc-head h2{font-size:18px}
}
/* HQ 36 review of 79ca29a9 */
.bc-head h2:focus{outline:none}
.bc-foot{position:sticky;bottom:calc(-1 * 20px);background:var(--bc-bg);padding:10px 0 4px;margin-top:auto;display:flex;gap:8px;flex-wrap:wrap;z-index:1}
.bc-outline{border:1px solid var(--bc-ln)!important;background:transparent!important;color:var(--bc-tx)!important}
.bc-opt b{display:flex;align-items:center;gap:8px}
.bc-ic{flex:none;color:var(--bc-tx)}
.bc-addr code{overflow-wrap:break-word;word-break:normal}
.bc-frow .bc-bn small{white-space:normal}
@media (max-width:640px){.bc-secl,.bc-sec{font-size:14px}.bc-foot{bottom:calc(-1 * max(20px, env(safe-area-inset-bottom)))}}
/* HQ 37 review of 0861448f: air above the action row; the sticky bar shades what scrolls under it */
.bc-foot{box-shadow:0 -14px 14px -14px rgba(0,0,0,.25);margin-top:12px}
.bc-body{scroll-padding-bottom:72px}
.bc-body > .bc-list:last-of-type{margin-bottom:8px}
/* bank UI self-review of 5a212289: in the shell view the action row follows the content (no sticky bar over the rows on a phone), on the panel's own ground */
.bc-view .bc-foot{position:static;bottom:auto;background:transparent;box-shadow:none}
.bc-view .bc-body{scroll-padding-bottom:0}
/* «Banka» transactions (m1-board.js bankList, owner 14.10): date groups, one row per transaction, the row opens in place */
.m1-btx-h{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:4px}
.m1-btx-h b{font-weight:600}
.m1-btx{list-style:none;margin:0;padding:0}
.m1-btx-g{font-size:13px;color:var(--k-text-2,#5E636A);margin:14px 0 2px;letter-spacing:0;text-transform:none}
.m1-btx-r>button{min-height:44px;display:flex;align-items:center;gap:12px;width:100%;padding:10px 2px;border:0;border-bottom:1px solid var(--k-line,#E6E8EB);background:none;color:inherit;font:inherit;text-align:left;cursor:pointer}
.m1-btx-t{flex:1;min-width:0}
.m1-btx-t b{display:block;font-weight:600;overflow-wrap:break-word}
.m1-btx-t small{display:block;color:var(--k-text-2,#5E636A);font-size:13px;overflow-wrap:break-word}   /* a match reads whole (audit p2 #7): it wraps, no ellipsis */
.m1-btx-r em{font-style:normal;font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:600}
.m1-btx-v{display:flex;align-items:center;gap:12px;flex:none}
.m1-btx-r .k-chip{flex:none}
.m1-btx-det{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:8px 2px 12px;border-bottom:1px solid var(--k-line,#E6E8EB)}
.m1-btx-det p{margin:0;flex:1;min-width:200px}
.m1-btx-more>button{width:100%;padding:12px 2px;border:0;background:none;color:var(--k-text-2,#5E636A);font:inherit;text-align:left;cursor:pointer}
@media (max-width:640px){.m1-btx-v{flex-direction:column;align-items:flex-end;gap:4px}.m1-btx-r .k-chip{display:none}.m1-btx-r.m1-bneed .k-chip{display:inline-flex}.m1-btx-t small,.m1-btx-g,.m1-btx-r .k-chip{font-size:14px}}
/* «Banka» page (app/m1-banka.js, HQ 43): accounts, the two-column reconcile screen, the 13-week chart, history with filters */
.bka-accts{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;margin:0 0 12px}
.bka-acct{background:var(--k-surface,#fff);border-radius:var(--k-r-card,20px);padding:16px 18px}
.bka-acct-h{display:flex;align-items:center;gap:10px}
.bka-acct-h b{display:block;font-weight:600}
.bka-acct-h small{display:block;color:var(--k-text-2,#5E636A);font-size:13px}
.bka-logo{width:36px;height:36px;flex:none}
.bka-acct dl{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:14px 0 6px}
.bka-acct dt{font-size:13px;color:var(--k-text-2,#5E636A)}
.bka-acct dd{margin:2px 0 0;font-size:20px;font-weight:600;font-variant-numeric:tabular-nums}
.bka-acct p{margin:0;font-size:14px}
.bka-warn{color:var(--k-warn-ink,#9A5B00)}
.bka-reclist{list-style:none;margin:0;padding:0}
.bka-rec{display:grid;grid-template-columns:minmax(150px,.8fr) 2fr;gap:18px;padding:16px 2px;border-bottom:1px solid var(--k-line,#E6E8EB)}
.bka-rec:last-child{border-bottom:0}
.bka-l{display:flex;flex-direction:column;gap:2px;min-width:0}
.bka-l b{font-weight:600;overflow-wrap:break-word}
.bka-l small{color:var(--k-text-2,#5E636A);font-size:13px}
.bka-l em{font-style:normal;font-size:18px;font-weight:600;font-variant-numeric:tabular-nums;margin-top:6px}
.bka-r{background:var(--k-surface-2,#F5F6F7);border-radius:14px;padding:10px 12px;min-width:0}
.bka-modes{display:flex;gap:2px;flex-wrap:wrap;margin-bottom:10px}
.bka-mode{border:0;background:none;color:var(--k-text-2,#5E636A);font:inherit;font-size:14px;padding:6px 9px;white-space:nowrap;border-radius:999px;cursor:pointer;min-height:36px}
.bka-mode[aria-selected="true"]{background:var(--k-surface,#fff);color:var(--k-text,#0B0B0C);font-weight:600;box-shadow:0 1px 2px rgba(0,0,0,.08)}
.bka-body{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px}
.bka-body>p{margin:0;flex:1 1 100%}
.bka-sug{flex:1;min-width:0;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.bka-sug b{font-weight:600;overflow-wrap:break-word}
.bka-form{flex:1 1 100%;display:grid;grid-template-columns:1fr 1fr;gap:8px 10px}
.bka-form label{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--k-text-2,#5E636A)}
.bka-form .bka-wide{grid-column:1/-1}
.bka-chk{flex-direction:row!important;align-items:center;gap:8px!important;grid-column:1/-1;color:var(--k-text,#0B0B0C)!important;font-size:14px!important}
.bka-split{flex:1 1 100%;display:flex;flex-direction:column;gap:6px}
.bka-split>div{display:grid;grid-template-columns:1fr 130px;gap:8px}
.bka-split p{margin:0;font-size:14px}
.bka-sent{opacity:.6}
.bka-chart svg{width:100%;height:140px;display:block;margin-top:8px}
.bka-chart rect.bka-in{fill:var(--k-ok,#2F8F5B)}
.bka-chart rect.bka-out{fill:var(--k-text-3,#9AA0A6)}
.bka-chart path.bka-bal{stroke:var(--k-text,#0B0B0C);stroke-width:2;vector-effect:non-scaling-stroke}
.bka-axis{display:flex;justify-content:space-between;margin:4px 0 0;font-size:13px;color:var(--k-text-2,#5E636A)}
.bka-lgd{display:flex;gap:16px;margin:8px 0 0;font-size:13px;color:var(--k-text-2,#5E636A)}
.bka-lgd i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.bka-lgd i.bka-in{background:var(--k-ok,#2F8F5B)}.bka-lgd i.bka-out{background:var(--k-text-3,#9AA0A6)}.bka-lgd i.bka-bal{background:var(--k-text,#0B0B0C);height:2px;vertical-align:3px}
.bka-hbar{display:flex;flex-direction:column;gap:8px;margin-bottom:6px}
.bka-more summary{cursor:pointer;color:var(--k-text-2,#5E636A);font-size:14px;min-height:44px;display:flex;align-items:center}
.bka-filters{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px 10px;align-items:end;margin-bottom:6px}
.bka-hbar .bka-q{width:100%}
.bka-filters label{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--k-text-2,#5E636A);min-width:0}
.bka-filters .k-input{width:100%;min-width:0}
.bka-filters .bka-chk{grid-column:auto;align-self:center;white-space:nowrap}
.bka-hrow{display:flex;align-items:center;gap:12px;padding:10px 2px;border-bottom:1px solid var(--k-line,#E6E8EB);min-height:44px}
.bka-empty .bka-acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
@media (max-width:640px){
  .bka-rec{grid-template-columns:1fr;gap:10px}
  .bka-form{grid-template-columns:1fr}
  .bka-split>div{grid-template-columns:1fr 110px}
  .bka-acct dd{font-size:18px}
  .bka-mode,.bka-lgd,.bka-l small,.bka-acct-h small,.bka-form label,.bka-filters label{font-size:14px}
  .bka-mode{min-height:44px}
}
