/* ═════════════════════════════════════════════════════════════════
   BUDGET — its own design system (budget-app.js)   B64 S3 → B65 W6
   The approved sample (samples/b65/budget.html, round 3): mint liquid glass
   over a drifting aurora, Plus Jakarta Sans — every component Budget's own,
   nothing borrowed from Mocca's look (065-022 · 025 · 026 · 030).
   R2: NO GLOSS — frosted, matte glass (no inset highlights, sheens or shiny
   fills); light colours; matte bars with a today marker; fixed sheet actions.
   Class-only selectors near icons (the icon-font rule): nothing here styles a
   bare span/i inside a container that holds a .mi.
   ═════════════════════════════════════════════════════════════════ */

/* ── which chrome shows ─────────────────────────────────────────── */
html:not([data-app="budget"]) #bgaShell{ display:none !important; }
html[data-app="budget"] #shell{ display:block; height:auto; min-height:100dvh; overflow:visible; background:transparent; }
html[data-app="budget"] #shell > .nav,
html[data-app="budget"] #shell > .sb,
html[data-app="budget"] #shell > #scrim,
html[data-app="budget"] #shell > .tb,
html[data-app="budget"] #shell > #pageFab,
html[data-app="budget"] #shell > main.body,
html[data-app="budget"] .route-fab{ display:none !important; }
html[data-app="budget"] body{ background:var(--bga-bg, #dff7ef); }
html[data-app="budget"][data-theme="dark"] body{ background:#04140f; }

/* ── tokens ─────────────────────────────────────────────────────── */
.bga{
  --ink:#06231d; --ink2:#2f5a50; --ink3:#557a71;
  --mint:#3fbf9a; --mint-d:#1f9d7a; --lime:#d7f27a; --rose:#ff8fa3; --sky:#7fd3ff; --sun:#ffd36e; --sun2:#ffb45c;
  --glass:rgba(255,255,255,.46); --glass2:rgba(255,255,255,.66); --glass3:rgba(255,255,255,.86); --edge:rgba(255,255,255,.8); --edge2:rgba(6,35,29,.09);
  --shadow:0 20px 50px -26px rgba(6,60,48,.38); --pop:rgba(250,255,253,.96);
  --pos:#12805c; --neg:#c93d5f; --grad:linear-gradient(135deg,#6fd8b3,#d7f27a); --on-grad:#05312a;
  --r:28px; --font:'Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --bar-h:64px;
  color:var(--ink); font-family:var(--font); -webkit-font-smoothing:antialiased;
}
html[data-app="budget"][data-theme="dark"] .bga{
  --ink:#e9fff8; --ink2:#b5e3d5; --ink3:#86b9ab;
  --glass:rgba(12,40,34,.52); --glass2:rgba(20,58,50,.72); --glass3:rgba(28,74,63,.9); --edge:rgba(159,240,212,.2); --edge2:rgba(159,240,212,.1);
  --shadow:0 24px 60px -28px rgba(0,0,0,.8); --pop:rgba(10,34,28,.97);
  --pos:#7ff0c7; --neg:#ff9bb0; --rose:#e87a90;
}
:where(.bga) :where(button){ font:inherit; color:inherit; background:none; border:0; padding:0; cursor:pointer; }
:where(.bga) :where(input){ font:inherit; color:inherit; }
.bga button:focus-visible, .bga [role="button"]:focus-visible, .bga input:focus-visible, .bga .bga-notes:focus-visible{ outline:2px solid var(--mint-d); outline-offset:2px; }
.bga .mi.bga-f{ font-variation-settings:'FILL' 1,'wght' 500,'GRAD' 0,'opsz' 24; }
.bga-glass{ background:var(--glass); border:1px solid var(--edge); box-shadow:var(--shadow); backdrop-filter:blur(22px) saturate(1.5); -webkit-backdrop-filter:blur(22px) saturate(1.5); }
.bga-pos{ color:var(--pos) !important; } .bga-neg{ color:var(--neg) !important; } .bga-nt{ color:var(--ink2); }

/* the aurora the glass floats over (flat colour blobs — no sheen) */
.bga-aurora{ position:fixed; inset:-20%; z-index:0; filter:blur(64px) saturate(1.15); opacity:.8; pointer-events:none; }
html[data-app="budget"][data-theme="dark"] .bga-aurora{ opacity:.4; }
.bga-aurora > i{ position:absolute; border-radius:50%; animation:bga-drift 24s ease-in-out infinite alternate; }
.bga-aurora > i:nth-child(1){ width:55vw; height:55vw; left:5%; top:0; background:radial-gradient(circle, #3fbf9a 0, transparent 65%); }
.bga-aurora > i:nth-child(2){ width:45vw; height:45vw; right:0; top:15%; background:radial-gradient(circle, #d7f27a 0, transparent 62%); animation-duration:30s; }
.bga-aurora > i:nth-child(3){ width:50vw; height:50vw; left:30%; bottom:-10%; background:radial-gradient(circle, #7fd3ff 0, transparent 60%); animation-duration:36s; }
@keyframes bga-drift{ to{ transform:translate(8%, 6%) scale(1.12); } }
@media (prefers-reduced-motion:reduce){ .bga-aurora > i{ animation:none; } .bga *{ transition:none !important; } }

/* signed-out ⇄ signed-in */
#shell.signed-out .bga-bar, #shell.signed-out .bga-main, #shell.signed-out .bga-tabs, #shell.signed-out .bga-fab, #shell.signed-out .bga-pop, #shell.signed-out .bga-bloom{ display:none !important; }
#shell.signed-in .bga-out{ display:none; }

/* ── the bar + "by Mocca" ───────────────────────────────────────── */
.bga-bar{ position:fixed; top:12px; inset-inline:max(16px, calc((100vw - 1200px) / 2 + 16px)); z-index:30; display:flex; align-items:center; gap:10px; padding:8px 10px 8px 8px; border-radius:999px; }
.bga-brand{ display:flex; align-items:center; gap:10px; padding:0 8px 0 0; border-radius:999px; text-align:start; flex:none; }
.bga-dot{ width:40px; height:40px; border-radius:50%; display:grid; place-items:center; background:var(--grad); color:var(--on-grad); flex:none; }
.bga-dot > .mi{ font-size:21px; }
.bga-dot.bga-logo{ background:none; border-radius:22.4%; object-fit:cover; }
.bga-dot.is-lg{ width:66px; height:66px; } .bga-dot.is-lg > .mi{ font-size:34px; }
.bga-brand-t{ display:flex; flex-direction:column; line-height:1.05; }
.bga-brand-t > b{ font:800 18px/1.05 var(--font); letter-spacing:-.02em; }
.bga-nav{ display:flex; gap:2px; margin-inline-start:6px; padding:4px; border-radius:999px; background:rgba(255,255,255,.26); border:1px solid var(--edge); }
html[data-theme="dark"] .bga-nav{ background:rgba(0,0,0,.14); }
.bga-nav .bga-tab{ height:40px; padding:0 14px; border-radius:999px; display:inline-flex; align-items:center; gap:7px; font:700 13.5px/1 var(--font); color:var(--ink2); white-space:nowrap; }
.bga-nav .bga-tab > .mi{ font-size:20px; }
.bga-nav .bga-tab.on{ background:var(--glass3); color:var(--ink); box-shadow:0 6px 16px -10px rgba(6,60,48,.45); }
.bga-sp{ flex:1; }
.bga-orb{ width:42px; height:42px; border-radius:50% !important; border:1px solid var(--edge) !important; background:var(--glass2) !important; display:grid; place-items:center; flex:none; }
.bga-orb > .mi{ font-size:20px; }
.bga-orb.bga-sm{ width:34px; height:34px; } .bga-orb.bga-sm > .mi{ font-size:18px; }
.bga-bar .ast-sub-launch{ width:auto; padding:0 14px 0 10px !important; border-radius:999px !important; gap:6px; display:inline-flex; align-items:center; font:700 13px var(--font); }
.bga-me{ width:42px; height:42px; border-radius:50%; background:#9ff0d4 center/cover no-repeat; border:2px solid var(--edge) !important; flex:none; }
.bga-me.is-sm{ width:40px; height:40px; }

/* "by Mocca" (065-027) — shared with Content: icon + wordmark, art picked by theme and script */
.mk-by{ display:inline-flex; align-items:center; gap:4px; margin-top:3px; font-size:10.5px; font-weight:600; line-height:1; color:var(--ink3, var(--fg-3)); white-space:nowrap; }
.mk-by > .mk-by-ic{ height:13px; width:13px; display:block; border-radius:3px; }
.mk-by > .mk-by-wm{ height:10.5px; width:auto; display:block; }
.mk-by > .mk-by-wm.is-ar{ height:12px; }
.mk-by > .is-d, html[data-theme="dark"] .mk-by > .is-l{ display:none; }
html[data-theme="dark"] .mk-by > .is-d{ display:block; }
.mk-by > .is-ar, html[lang^="ar"] .mk-by > .is-lat{ display:none !important; }
html[lang^="ar"] .mk-by > .is-ar.is-l{ display:block !important; }
html[lang^="ar"][data-theme="dark"] .mk-by > .is-ar.is-l{ display:none !important; }
html[lang^="ar"][data-theme="dark"] .mk-by > .is-ar.is-d{ display:block !important; }

/* popovers */
.bga-pop{ position:fixed; z-index:45; border-radius:24px; padding:8px; display:flex; flex-direction:column; gap:2px; background:var(--pop) !important; }
.bga-pop[hidden]{ display:none; }
.bga-menu{ top:84px; inset-inline-end:max(16px, calc((100vw - 1200px) / 2 + 16px)); width:min(300px, calc(100vw - 32px)); }
.bga-pop > button{ display:flex; align-items:center; gap:12px; min-height:44px; padding:8px 10px; border-radius:16px; text-align:start; font:600 14px/1.3 var(--font); }
.bga-pop > button:hover{ background:var(--glass2); }
.bga-pop > button > .mi{ font-size:20px; color:var(--mint-d); flex:none; }
html[data-theme="dark"] .bga-pop > button > .mi{ color:var(--mint); }
.bga-menu-h{ display:flex; gap:12px; align-items:center; padding:8px 8px 12px; border-bottom:1px solid var(--edge2); margin-bottom:6px; min-width:0; }
.bga-menu-h b{ display:block; font:800 15px/1.2 var(--font); }
.bga-menu-h small{ display:block; color:var(--ink3); font:500 12px/1.3 var(--font); overflow:hidden; text-overflow:ellipsis; }
.bga-menu-l{ padding:6px 10px 4px; font:700 11px var(--font); letter-spacing:.06em; text-transform:uppercase; color:var(--ink3); }
.bga-langs{ display:flex; gap:4px; padding:0 6px 6px; }
.bga-langs > button{ flex:1; min-height:38px; border-radius:14px; border:1px solid var(--edge) !important; font:700 12.5px var(--font) !important; color:var(--ink2) !important; }
.bga-langs > button[aria-pressed="true"]{ background:var(--grad) !important; color:var(--on-grad) !important; border-color:transparent !important; }

/* ── the page ───────────────────────────────────────────────────── */
.bga-main{ position:relative; z-index:1; max-width:1200px; margin:0 auto; padding:calc(var(--bar-h) + 28px) 20px 130px; }
.bga-view{ display:block; }
.bga-lbl{ font:700 11.5px/1.3 var(--font); letter-spacing:.12em; text-transform:uppercase; color:var(--ink3); }
.bga-sec{ margin-top:28px; }
.bga-sec.bga-top{ margin-top:4px; }
.bga-sec-h{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin:0 6px 12px; min-width:0; }
.bga-sec-h h2{ margin:0; font:800 21px/1.2 var(--font); letter-spacing:-.025em; }
.bga-sec-r{ display:flex; align-items:center; gap:6px; flex-wrap:wrap; justify-content:flex-end; }
.bga-link{ display:inline-flex; align-items:center; gap:0; font:700 13px var(--font); color:var(--ink2); height:34px; padding:0 4px 0 8px; border-radius:999px; }
.bga-link > .mi{ font-size:18px; }
.bga-link:hover{ color:var(--ink); }
.bga-day{ font:800 11.5px/1 var(--font); letter-spacing:.1em; text-transform:uppercase; color:var(--ink3); margin:18px 12px 8px; }
.bga-none{ padding:18px 16px; color:var(--ink3); font:600 13.5px/1.45 var(--font); }
.bga-note{ display:flex; gap:8px; align-items:flex-start; margin:0; padding:10px 12px; border-radius:16px; background:var(--glass2); font:600 12.5px/1.45 var(--font); color:var(--ink2); }
.bga-note > .mi{ font-size:18px; }

/* pills, chips, tags */
.bga-bt{ height:36px; padding:0 14px !important; border-radius:999px !important; border:1px solid var(--edge) !important; background:var(--glass2) !important; font:700 13px var(--font) !important; display:inline-flex; align-items:center; gap:6px; white-space:nowrap; }
.bga-bt > .mi{ font-size:18px; }
.bga-bt:hover{ background:var(--glass3) !important; }
.bga-bt.is-pri{ background:var(--grad) !important; color:var(--on-grad) !important; border-color:transparent !important; }
.bga-bt.is-danger{ color:var(--neg) !important; }
.bga-bt.is-ghost{ background:transparent !important; }
.bga-bt.is-lg{ height:48px; padding:0 22px !important; font-size:15px !important; }
.bga-bt.is-wide{ width:100%; justify-content:center; height:46px; }
.bga-bt[disabled]{ opacity:.45; cursor:default; }
.bga-tag{ display:inline-flex; align-items:center; gap:3px; height:21px; padding:0 8px; border-radius:999px; background:rgba(255,255,255,.55); border:1px solid var(--edge); font:700 11px/1 var(--font); color:var(--ink2); white-space:nowrap; }
html[data-theme="dark"] .bga-tag{ background:rgba(0,0,0,.18); }
.bga-tag > .mi{ font-size:13px; }
.bga-tag.is-due{ background:rgba(255,211,110,.4); color:#6d4a00; border-color:transparent; }
.bga-tag.is-new{ background:rgba(127,211,255,.35); color:#0d4a6b; border-color:transparent; }
.bga-tag.is-in{ background:rgba(63,191,154,.22); color:#0f6b4d; border-color:transparent; }
.bga-tag.is-bad{ background:rgba(255,143,163,.3); color:#9a2440; border-color:transparent; }
html[data-theme="dark"] .bga-tag.is-due{ color:#ffd98a; } html[data-theme="dark"] .bga-tag.is-new{ color:#b8e6ff; }
html[data-theme="dark"] .bga-tag.is-in{ color:#8ff0cb; } html[data-theme="dark"] .bga-tag.is-bad{ color:#ffb3c2; }
.bga-tag.is-trip, .bga-tag.is-hh{ background:transparent; }
.bga-chip{ height:40px; padding:0 14px 0 10px !important; border-radius:999px !important; border:1.5px solid var(--edge) !important; background:var(--glass2) !important; display:inline-flex; align-items:center; gap:7px; font:700 13px var(--font) !important; white-space:nowrap; flex:0 0 auto; }
.bga-chip > .mi{ font-size:19px; color:var(--ink2); }
.bga-chip > small{ font:600 11px var(--font); color:var(--ink3); }
.bga-chip.on{ border-color:var(--mint) !important; background:var(--glass3) !important; box-shadow:0 0 0 3px rgba(63,191,154,.22); }
.bga-chip.is-add{ border-style:dashed !important; background:transparent !important; }

/* the matte bar ("liquid gauge", 028 — no rings, no tanks, no gloss) */
.bga-tube{ display:block; position:relative; height:12px; border-radius:999px; background:rgba(6,35,29,.08); overflow:hidden; flex:none; }
html[data-theme="dark"] .bga-tube{ background:rgba(233,255,248,.1); }
.bga-liq{ position:absolute; inset-block:0; inset-inline-start:0; width:var(--p); background:var(--c, var(--mint)); border-radius:999px; transition:width .8s cubic-bezier(.3,1.1,.4,1); }
.bga-mbar{ position:relative; display:block; margin-top:10px; padding-bottom:18px; }
.bga-mbar > .bga-tube{ height:14px; }
.bga-today{ position:absolute; top:-4px; height:22px; inset-inline-start:var(--t); width:2px; border-radius:2px; background:var(--ink); }
.bga-today > span{ position:absolute; top:calc(100% + 2px); inset-inline-start:50%; transform:translateX(-50%); white-space:nowrap; font:700 10.5px/1.2 var(--font); color:var(--ink3); }
[dir="rtl"] .bga-today > span{ transform:translateX(50%); }
.bga-today.is-end > span{ inset-inline-start:auto; inset-inline-end:0; transform:none; }
.bga-today.is-start > span{ inset-inline-start:0; transform:none; }

/* the liquid capsule — the bar selector */
.bga-cap{ position:relative; display:flex; padding:5px; border-radius:999px; isolation:isolate; }
.bga-cap > button{ position:relative; z-index:1; flex:1 1 0; min-width:0; height:44px; padding:0 12px; border-radius:999px; font:700 13.5px/1 var(--font); color:var(--ink2); display:inline-flex; align-items:center; justify-content:center; gap:6px; white-space:nowrap; transition:color .2s; }
.bga-cap > button > .mi{ font-size:19px; }
.bga-cap > button.on{ color:var(--on-grad); }
.bga-cap .bga-n{ min-width:20px; height:20px; padding:0 6px; border-radius:999px; background:rgba(6,35,29,.1); font:800 11px/20px var(--font); }
html[data-theme="dark"] .bga-cap > button:not(.on) .bga-n{ background:rgba(233,255,248,.14); }
.bga-cap > button.on .bga-n{ background:rgba(255,255,255,.6); }
.bga-thumb{ position:absolute; z-index:0; top:5px; bottom:5px; left:5px; width:0; border-radius:999px; background:var(--grad); box-shadow:0 8px 18px -12px rgba(20,120,90,.6); transition:left .35s cubic-bezier(.3,1.3,.5,1), width .35s cubic-bezier(.3,1.3,.5,1); }
.bga-cap.is-sm > button{ height:38px; font-size:13px; }
.bga-capwrap{ position:sticky; top:calc(var(--bar-h) + 20px); z-index:6; margin:0 0 6px; }

/* ── Home ───────────────────────────────────────────────────────── */
.bga-hero{ display:grid; grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); gap:18px; }
.bga-bal{ position:relative; overflow:hidden; border-radius:var(--r); padding:26px 28px; min-height:224px; }
.bga-bal h1{ position:relative; z-index:1; margin:8px 0 0; font:800 clamp(38px, 6vw, 62px)/1 var(--font); letter-spacing:-.045em; display:flex; align-items:baseline; flex-wrap:wrap; gap:4px 10px; }
.bga-bal h1 small{ font:700 15px var(--font); letter-spacing:0; color:var(--ink3); }
.bga-delta{ position:relative; z-index:1; display:inline-flex; align-items:center; gap:6px; margin-top:12px; padding:6px 12px; border-radius:999px; background:rgba(63,191,154,.18); color:var(--pos); font:700 12.5px/1.3 var(--font); }
.bga-delta > .mi{ font-size:16px; }
.bga-bal svg{ position:absolute; inset-inline:0; bottom:0; width:100%; height:46%; }
.bga-spark-a{ fill:var(--mint); opacity:.14; }
.bga-spark-l{ fill:none; stroke:var(--mint-d); stroke-width:3; stroke-linecap:round; stroke-linejoin:round; vector-effect:non-scaling-stroke; }
html[data-theme="dark"] .bga-spark-l{ stroke:var(--mint); }
.bga-stack{ display:grid; grid-template-rows:1fr 1fr; gap:18px; min-width:0; }
.bga-mini{ padding:18px 22px 12px; border-radius:var(--r); display:flex; flex-direction:column; align-items:stretch; text-align:start; min-width:0; }
.bga-mini:hover{ background:var(--glass2); }
.bga-mini-t{ display:flex; justify-content:space-between; align-items:baseline; gap:10px; }
.bga-mini-t > small{ font:600 12.5px/1.35 var(--font); color:var(--ink3); min-width:0; }
.bga-mini-t > em{ font:700 12px/1.3 var(--font); font-style:normal; color:var(--ink2); white-space:nowrap; }
.bga-mini > b{ display:block; margin-top:2px; font:800 26px/1.15 var(--font); letter-spacing:-.03em; font-variant-numeric:tabular-nums; }
.bga-cols{ display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:18px; }
.bga-cols > div{ min-width:0; }

/* ── accounts: light tints, a band, the bank's logo (065-029) ─── */
.bga-accts{ display:grid; grid-auto-flow:column; grid-auto-columns:minmax(250px, 1fr); gap:14px; overflow-x:auto; scroll-snap-type:x mandatory; padding:4px 4px 16px; scrollbar-width:none; }
.bga-accts::-webkit-scrollbar{ display:none; }
.bga-agrid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:16px; }
.bga-acct{ scroll-snap-align:start; position:relative; overflow:hidden; min-height:164px; padding:16px 18px 16px 20px !important; border-radius:26px !important; display:flex; flex-direction:column; gap:10px; text-align:start; color:var(--ink) !important;
  border:1px solid var(--edge) !important; background:color-mix(in srgb, var(--a1) 12%, rgba(255,255,255,.74)) !important; box-shadow:0 18px 36px -28px rgba(6,60,48,.55); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); }
html[data-theme="dark"] .bga-acct{ background:color-mix(in srgb, var(--a1) 11%, rgba(16,48,41,.7)) !important; }
.bga-acct:hover{ transform:translateY(-2px); transition:transform .2s; }
.bga-acct.is-flat:hover{ transform:none; }
.bga-acct-band{ position:absolute; inset-inline-start:0; top:18px; bottom:18px; width:4px; border-radius:0 4px 4px 0; background:var(--a1); }
[dir="rtl"] .bga-acct-band{ border-radius:4px 0 0 4px; }
.bga-acct-t{ display:flex; align-items:center; gap:10px; min-width:0; }
.bga-acct-n{ min-width:0; display:flex; flex-direction:column; }
.bga-acct-n > b{ font:800 15px/1.2 var(--font); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bga-acct-n > small{ font:600 12px/1.3 var(--font); color:var(--ink3); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bga-acct-bar{ display:flex; flex-direction:column; gap:4px; }
.bga-acct-bar > .bga-tube{ height:10px; }
.bga-acct-bar > small{ font:700 11px var(--font); color:var(--ink3); }
.bga-acct-v{ margin-top:auto; display:flex; flex-direction:column; }
.bga-acct-v > b{ font:800 25px/1.1 var(--font); letter-spacing:-.03em; font-variant-numeric:tabular-nums; }
.bga-acct-v > b.bga-acct-link{ font:700 14px/1.3 var(--font); letter-spacing:0; color:var(--ink2); }
.bga-acct-v > small{ font:600 12px var(--font); color:var(--ink3); letter-spacing:.06em; }
.bga-logo{ width:40px; height:40px; border-radius:13px; background:#fff center/74% no-repeat; border:1px solid rgba(6,35,29,.08); flex:none; display:grid; place-items:center; overflow:hidden; }
.bga-logo.is-ic{ background:var(--glass3); color:var(--ink2); }
.bga-logo.is-ic > .mi{ font-size:20px; }
.bga-logo.bga-av{ border-radius:13px; }
.bga-logo.is-sm{ width:34px; height:34px; border-radius:50%; }
.bga-logo.is-xs{ width:20px; height:20px; border-radius:6px; }
.bga-logo.is-xs > .mi{ font-size:14px; }
.bga-comp{ padding:16px 18px; border-radius:24px; margin-bottom:6px; display:flex; flex-direction:column; gap:10px; }
.bga-comp-bar{ display:flex; height:20px; border-radius:999px; overflow:hidden; border:1.5px solid var(--edge); }
.bga-comp-bar > span{ display:block; height:100%; opacity:.72; }
.bga-comp-k{ display:flex; gap:8px 16px; flex-wrap:wrap; font:700 12px var(--font); color:var(--ink2); }
.bga-comp-k > span{ display:inline-flex; align-items:center; gap:6px; }
.bga-comp-k b{ color:var(--ink); }
.bga-acct-big .bga-acct{ min-height:170px; }

/* ── money rows ("coins") ───────────────────────────────────────── */
.bga-list{ border-radius:26px; padding:8px; }
.bga-list-h{ display:flex; align-items:center; justify-content:space-between; gap:8px; margin:4px 8px 6px; }
.bga-list-h h4{ margin:0; font:800 15px/1.2 var(--font); display:flex; align-items:center; gap:8px; }
.bga-list-h h4 > .mi{ font-size:20px; color:var(--ink2); }
.bga-list-h.is-out{ margin:18px 4px 8px; }
.bga-row{ display:flex; align-items:center; gap:14px; padding:12px; border-radius:20px; cursor:pointer; transition:background .15s; width:100%; text-align:start; }
.bga-row:hover{ background:var(--glass2); }
.bga-row.is-btn > .mi{ color:var(--ink3); }
.bga-coin{ width:46px; height:46px; border-radius:50%; display:grid; place-items:center; background:var(--glass3); border:1px solid var(--edge); flex:none; color:var(--ink2); overflow:hidden; }
.bga-coin > .mi{ font-size:22px; }
.bga-coin.is-in{ background:rgba(63,191,154,.2); color:var(--pos); }
.bga-coin.is-out{ background:rgba(255,143,163,.16); color:#b3334f; }
html[data-theme="dark"] .bga-coin.is-out{ color:#ffb3c2; }
.bga-coin.is-sm{ width:36px; height:36px; } .bga-coin.is-sm > .mi{ font-size:18px; }
.bga-coin.is-lg{ width:64px; height:64px; } .bga-coin.is-lg > .mi{ font-size:32px; }
.bga-row-m{ flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.bga-row-m > b{ font:700 15px/1.25 var(--font); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bga-row-s{ display:flex; align-items:center; gap:6px; flex-wrap:wrap; font:500 12.5px/1.35 var(--font); color:var(--ink3); min-width:0; }
.bga-row-acts{ display:flex; gap:6px; margin-top:8px; flex-wrap:wrap; }
.bga-row-v{ text-align:end; flex:none; display:flex; flex-direction:column; align-items:flex-end; }
.bga-row-v > b{ font:800 15.5px/1.2 var(--font); letter-spacing:-.01em; font-variant-numeric:tabular-nums; white-space:nowrap; }
.bga-row-v > small{ font:600 11.5px var(--font); color:var(--ink3); white-space:nowrap; }

/* avatars */
.bga-av{ width:30px; height:30px; border-radius:50%; flex:none; display:grid; place-items:center; background:hsl(var(--h, 160) 70% 84%) center/cover no-repeat; color:#06231d; font:800 11px/1 var(--font); border:2px solid var(--glass3); }
.bga-av.is-ic{ background:var(--glass3); color:var(--ink3); }
.bga-av.is-ic > .mi{ font-size:16px; }
.bga-av.is-sm{ width:32px; height:32px; }
.bga-av.is-lg{ width:56px; height:56px; font-size:18px; }
.bga-av.bga-coin{ width:46px; height:46px; font-size:14px; }
.bga-avs{ display:flex; }
.bga-avs > .bga-av{ width:28px; height:28px; margin-inline-start:-9px; font-size:10px; }
.bga-avs > .bga-av:first-child{ margin-inline-start:0; }

/* ── trips as postcards ─────────────────────────────────────────── */
.bga-tgrid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(280px, 1fr)); gap:18px; }
.bga-post{ border-radius:28px !important; overflow:hidden; display:flex; flex-direction:column; text-align:start; width:100%; padding:0 !important; }
.bga-post:not(.is-flat):hover{ transform:translateY(-2px); transition:transform .2s; }
.bga-post-ph{ height:148px; position:relative; background:var(--pg); display:flex; align-items:flex-end; padding:14px 16px; color:#0a2c24; }
.bga-post-ph > b{ position:relative; z-index:1; font:800 22px/1.08 var(--font); letter-spacing:-.03em; max-width:72%; }
.bga-stamp{ position:absolute; top:12px; inset-inline-end:12px; width:56px; height:64px; border-radius:8px; background:rgba(255,255,255,.88); color:#06231d; display:flex; flex-direction:column; align-items:center; justify-content:center; font:800 18px/1 var(--font); border:2px dashed rgba(6,35,29,.25); transform:rotate(4deg); }
.bga-stamp > small{ font:700 9.5px var(--font); letter-spacing:.08em; text-transform:uppercase; color:#557a71; margin-top:3px; }
.bga-post-bd{ padding:14px 16px 16px; display:flex; flex-direction:column; gap:10px; }
.bga-post-meta{ display:flex; align-items:center; justify-content:space-between; gap:8px; font:600 12.5px/1.3 var(--font); color:var(--ink2); }
.bga-post-mn{ display:flex; align-items:center; justify-content:space-between; gap:8px; font:700 12.5px var(--font); color:var(--ink2); }
.bga-post.is-flat{ box-shadow:none; }
.bga-post.is-flat .bga-post-ph{ height:120px; }

/* ── household (065-157) ────────────────────────────────────────── */
.bga-hh-sw{ display:flex; gap:8px; overflow-x:auto; scrollbar-width:none; padding:2px 2px 14px; }
.bga-hh-sw::-webkit-scrollbar{ display:none; }
.bga-hh{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); gap:18px; align-items:start; }
.bga-hh-l{ display:flex; flex-direction:column; gap:18px; min-width:0; }
.bga-hh-card{ padding:20px 22px; border-radius:var(--r); display:flex; flex-direction:column; gap:14px; }
.bga-hh-hd{ display:flex; align-items:center; justify-content:space-between; gap:8px; }
.bga-hh-card h3{ margin:0; font:800 26px/1.1 var(--font); letter-spacing:-.03em; display:flex; align-items:center; gap:10px; }
.bga-hh-card h3 > .mi{ font-size:30px; color:var(--mint-d); }
html[data-theme="dark"] .bga-hh-card h3 > .mi{ color:var(--mint); }
.bga-mems{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.bga-mem{ display:inline-flex; align-items:center; gap:8px; padding:4px 12px 4px 4px !important; border-radius:999px !important; background:var(--glass2) !important; border:1px solid var(--edge) !important; font:700 13px/1.2 var(--font) !important; min-height:40px; }
.bga-mem.is-pend{ border-style:dashed !important; color:var(--ink3); background:transparent !important; }
.bga-hh-m > small{ display:block; font:600 12.5px var(--font); color:var(--ink3); }
.bga-hh-m > b{ display:block; font:800 28px/1.15 var(--font); letter-spacing:-.03em; font-variant-numeric:tabular-nums; }
.bga-hh-m > em{ display:block; font:700 12px/1.35 var(--font); font-style:normal; color:var(--ink2); }
.bga-split3{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:10px; }
.bga-split3 > div{ padding:12px 14px; border-radius:18px; background:var(--glass2); border:1px solid var(--edge); min-width:0; }
.bga-split3 small{ display:block; font:600 12px var(--font); color:var(--ink3); }
.bga-split3 b{ display:block; font:800 16px/1.25 var(--font); letter-spacing:-.02em; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bga-gro{ padding:10px; border-radius:26px; }
.bga-gi{ display:flex; align-items:center; gap:10px; padding:8px; border-radius:18px; }
.bga-gi:hover{ background:var(--glass2); }
.bga-chk{ width:32px; height:32px; border-radius:50%; border:2px solid var(--ink3) !important; display:grid; place-items:center; flex:none; color:var(--on-grad); }
.bga-chk > .mi{ font-size:18px; opacity:0; }
.bga-gi.is-done .bga-chk{ background:var(--grad) !important; border-color:transparent !important; }
.bga-gi.is-done .bga-chk > .mi{ opacity:1; }
.bga-gi-m{ flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; text-align:start; padding:4px 2px !important; border-radius:12px !important; }
.bga-gi-m > b{ font:700 14.5px/1.25 var(--font); }
.bga-gi-m > span{ font:500 12px/1.35 var(--font); color:var(--ink3); display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
.bga-gi.is-done .bga-gi-m > b{ text-decoration:line-through; text-decoration-thickness:2px; color:var(--ink3); }
.bga-step{ display:inline-flex; align-items:center; border-radius:999px; background:var(--glass3); border:1px solid var(--edge); height:38px; flex:none; }
.bga-step > button{ width:36px; height:36px; border-radius:50% !important; display:grid; place-items:center; }
.bga-step > button > .mi{ font-size:18px; }
.bga-step > button[disabled]{ opacity:.35; cursor:default; }
.bga-step > b{ min-width:22px; text-align:center; font:800 14px var(--font); font-variant-numeric:tabular-nums; }
.bga-gi.is-done .bga-step{ opacity:.5; }
.bga-banner{ display:flex; align-items:center; gap:12px; padding:12px 14px; border-radius:22px; margin-bottom:14px; font:700 13.5px/1.35 var(--font); }
.bga-banner > .mi{ font-size:22px; color:var(--ink2); }
.bga-banner-t{ flex:1; min-width:0; display:flex; flex-direction:column; }
.bga-banner small{ font:600 12px var(--font); color:var(--ink3); }
.bga-banner.is-new{ background:rgba(127,211,255,.22); }
.bga-empty{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:10px; padding:36px 24px; border-radius:var(--r); }
.bga-empty h3{ margin:4px 0 0; font:800 22px var(--font); }
.bga-empty p{ margin:0 0 8px; max-width:440px; color:var(--ink2); font:500 14.5px/1.5 var(--font); }

/* ── FAB + bloom ────────────────────────────────────────────────── */
.bga-fab{ position:fixed; z-index:40; bottom:26px; inset-inline-end:max(20px, calc((100vw - 1200px) / 2 + 20px)); width:64px; height:64px; border-radius:24px !important; background:var(--grad) !important; color:var(--on-grad) !important; box-shadow:0 16px 34px -16px rgba(20,120,90,.7); display:grid; place-items:center; }
.bga-fab > .mi{ font-size:32px; transition:transform .3s; }
.bga-fab.open > .mi{ transform:rotate(45deg); }
html.bga-sheet-open .bga-fab{ opacity:0; pointer-events:none; }
.bga-bloom-bg{ position:fixed; inset:0; z-index:38; background:rgba(4,30,24,.16); backdrop-filter:blur(5px); -webkit-backdrop-filter:blur(5px); opacity:0; pointer-events:none; transition:opacity .25s; }
.bga-bloom-bg.open{ opacity:1; pointer-events:auto; }
.bga-bloom{ position:fixed; z-index:39; inset-inline-end:max(20px, calc((100vw - 1200px) / 2 + 20px)); bottom:104px; width:340px; padding:12px; border-radius:28px; display:grid; grid-template-columns:repeat(3, 1fr); gap:8px; transform-origin:bottom right; transform:scale(.6) translateY(30px); opacity:0; pointer-events:none; transition:transform .35s cubic-bezier(.3,1.4,.5,1), opacity .2s; background:var(--pop) !important; }
[dir="rtl"] .bga-bloom{ transform-origin:bottom left; }
.bga-bloom.open{ transform:none; opacity:1; pointer-events:auto; }
.bga-bloom > button{ border:1px solid var(--edge) !important; background:var(--glass2) !important; border-radius:22px !important; padding:14px 6px 10px !important; display:flex; flex-direction:column; align-items:center; gap:8px; font:700 12.5px/1.2 var(--font) !important; text-align:center; }
.bga-bloom > button:hover{ background:var(--glass3) !important; }
.bga-bloom > button > i{ width:46px; height:46px; border-radius:16px; display:grid; place-items:center; background:var(--bgc); color:var(--on-grad); font-style:normal; }
.bga-bloom > button > i > .mi{ font-size:23px; }

/* ── the phone tabs ─────────────────────────────────────────────── */
.bga-tabs{ display:none; }

/* ── THE SHEET ──────────────────────────────────────────────────── */
.bga-sh-bg{ position:fixed; inset:0; z-index:600; background:rgba(4,30,24,.22); backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px); opacity:0; pointer-events:none; transition:opacity .25s; }
.bga-sh-bg.open{ opacity:1; pointer-events:auto; }
.bga-sheet{ position:fixed; z-index:610; top:12px; bottom:12px; inset-inline-end:12px; width:min(480px, calc(100% - 24px)); border-radius:30px; display:flex; flex-direction:column; overflow:hidden;
  transform:translateX(112%); visibility:hidden; transition:transform .38s cubic-bezier(.3,1.1,.4,1), visibility 0s linear .38s; background:var(--pop) !important; }
[dir="rtl"] .bga-sheet{ transform:translateX(-112%); }
.bga-sheet.open{ transform:none; visibility:visible; transition:transform .38s cubic-bezier(.3,1.1,.4,1), visibility 0s; }
.bga-grab{ display:none; width:44px; height:5px; border-radius:5px; background:var(--ink3); opacity:.4; margin:8px auto 0; flex:none; }
.bga-sh-hd{ display:flex; align-items:center; gap:8px; padding:14px 14px 8px 16px; flex:none; }
.bga-sh-t{ flex:1; margin:0; min-width:0; font:800 22px/1.15 var(--font); letter-spacing:-.025em; display:flex; flex-direction:column; }
.bga-sh-t > small{ font:600 12px/1.3 var(--font); color:var(--ink3); letter-spacing:0; margin-bottom:2px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bga-sh-t > span{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
[dir="rtl"] .bga-sh-t > span, [dir="rtl"] .bga-sh-t > small{ unicode-bidi:plaintext; text-align:right; }   /* B67 R25 (R67-100) — a Latin sheet title cut at its start in Arabic (R67-014) */
.bga-sh-acts{ display:flex; align-items:center; gap:6px; flex:none; }
.bga-sh-hd .ast-launch-panel{ height:42px; min-width:42px; padding:0 12px !important; border-radius:999px !important; border:1px solid var(--edge) !important; background:var(--glass2) !important; color:var(--ink) !important; display:inline-flex; align-items:center; justify-content:center; gap:6px; font:700 13px var(--font) !important; }
.bga-sh-vp{ position:relative; flex:1; min-height:0; overflow:hidden; }
.bga-sl{ position:absolute; inset:0; overflow:auto; overscroll-behavior:contain; padding:6px 16px 22px; display:flex; flex-direction:column; gap:12px; transition:transform .32s cubic-bezier(.3,1.1,.4,1), opacity .25s; }
.bga-sl > *{ flex-shrink:0; }
.bga-sl.is-r{ transform:translateX(100%); opacity:0; } .bga-sl.is-l{ transform:translateX(-30%); opacity:0; }
[dir="rtl"] .bga-sl.is-r{ transform:translateX(-100%); } [dir="rtl"] .bga-sl.is-l{ transform:translateX(30%); }
/* the main action NEVER scrolls away (R2: "should be fixed not lost in scroll") */
.bga-sh-ft{ flex:none; display:flex; align-items:center; gap:8px; padding:12px 16px calc(14px + env(safe-area-inset-bottom, 0px)); border-top:1px solid var(--edge2); background:var(--pop); }
.bga-sh-ft[hidden]{ display:none; }
.bga-full{ flex:1; min-width:0; height:54px; border-radius:999px !important; background:var(--grad) !important; color:var(--on-grad) !important; font:800 16px var(--font) !important; display:inline-flex; align-items:center; justify-content:center; gap:8px; box-shadow:0 12px 26px -18px rgba(20,120,90,.8); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:0 18px !important; }
.bga-full > .mi{ font-size:21px; }
.bga-full.is-soft{ background:var(--glass2) !important; color:var(--ink) !important; border:1px solid var(--edge) !important; box-shadow:none; }
.bga-full[disabled]{ cursor:default; opacity:.8; }
.bga-sh-ft .bga-bt{ height:54px; }
.bga-confirm{ position:fixed; inset:0; z-index:660; display:grid; place-items:center; padding:20px; background:rgba(4,30,24,.28); }
.bga-confirm[hidden]{ display:none; }
.bga-cf-card{ width:min(400px, 100%); border-radius:28px; padding:22px; background:var(--pop) !important; display:flex; flex-direction:column; gap:8px; }
.bga-cf-card h3{ margin:0; font:800 19px/1.25 var(--font); }
.bga-cf-card p{ margin:0; color:var(--ink2); font:500 14px/1.5 var(--font); }
.bga-cf-acts{ display:flex; justify-content:flex-end; gap:8px; margin-top:10px; }
.bga-cf-acts .bga-bt{ height:44px; }

/* sheet atoms */
.bga-fl{ font:800 11.5px/1 var(--font); letter-spacing:.09em; text-transform:uppercase; color:var(--ink3); margin:8px 4px -4px; }
.bga-amt{ padding:18px; border-radius:24px; background:var(--glass3); border:1px solid var(--edge); text-align:center; display:flex; flex-direction:column; align-items:center; gap:6px; }
.bga-cur{ display:inline-flex; align-items:center; gap:2px; height:30px; padding:0 8px 0 12px !important; border-radius:999px !important; background:rgba(6,35,29,.07) !important; font:800 12.5px var(--font) !important; }
html[data-theme="dark"] .bga-cur{ background:rgba(233,255,248,.1) !important; }
.bga-cur > .mi{ font-size:18px; }
.bga-curs{ display:flex; gap:6px; flex-wrap:wrap; justify-content:center; }
.bga-curs[hidden]{ display:none; }
.bga-curs .bga-chip{ height:34px; padding:0 12px !important; }
.bga-amt-in{ display:block; width:100%; border:0; background:none; text-align:center; font:800 40px/1.1 var(--font); letter-spacing:-.04em; color:var(--ink); outline:none; padding:2px 0; }
.bga-amt-in.is-big{ font-size:46px; }
.bga-amt-in::placeholder{ color:var(--ink3); opacity:.5; }
.bga-amt-in.is-bad{ color:var(--neg); }
.bga-amt.is-lock{ gap:4px; }
.bga-amt-v{ font:800 40px/1.1 var(--font); letter-spacing:-.04em; font-variant-numeric:tabular-nums; }
.bga-amt > small{ font:600 12.5px var(--font); color:var(--ink3); }
.bga-err{ font:700 12px var(--font); color:var(--neg); margin:-4px 6px 0; }
.bga-err[hidden]{ display:none; }
.bga-in{ width:100%; height:50px; padding:0 16px; border-radius:18px; border:1.5px solid var(--edge); background:var(--glass3); font:600 15px var(--font); color:var(--ink); outline:none; box-sizing:border-box; }
.bga-in::placeholder{ color:var(--ink3); }
.bga-in:focus{ border-color:var(--mint); box-shadow:0 0 0 3px rgba(63,191,154,.2); }
.bga-in.is-num{ width:96px; text-align:center; }
.bga-2{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.bga-fld{ display:flex; flex-direction:column; gap:6px; }
.bga-fld > span{ font:800 11.5px/1 var(--font); letter-spacing:.09em; text-transform:uppercase; color:var(--ink3); margin:0 4px; }
.bga-fld.is-inline{ flex-direction:row; align-items:center; justify-content:space-between; gap:12px; padding:6px 6px 6px 12px; border-radius:18px; background:var(--glass2); border:1px solid var(--edge); }
.bga-fld.is-inline > span{ letter-spacing:.04em; }
.bga-pickrow{ display:flex; gap:8px; overflow-x:auto; padding:2px 2px 6px; scrollbar-width:thin; }
.bga-pk{ flex:0 0 auto; display:flex; align-items:center; gap:8px; min-height:50px; padding:5px 14px 5px 5px !important; border-radius:999px !important; border:1.5px solid var(--edge) !important; background:var(--glass2) !important; text-align:start; }
.bga-pk-t{ display:flex; flex-direction:column; }
.bga-pk b{ font:700 13px/1.2 var(--font); white-space:nowrap; }
.bga-pk small{ font:600 11px/1.2 var(--font); color:var(--ink3); }
.bga-pk.on{ border-color:var(--mint) !important; background:var(--glass3) !important; box-shadow:0 0 0 3px rgba(63,191,154,.22); }
.bga-cats{ display:grid; grid-template-columns:repeat(5, minmax(0,1fr)); gap:8px; }
.bga-cat{ border:1.5px solid var(--edge) !important; background:var(--glass2) !important; border-radius:20px !important; padding:10px 4px !important; display:flex; flex-direction:column; align-items:center; gap:6px; font:700 11.5px/1.2 var(--font) !important; text-align:center; min-width:0; }
.bga-cat > .mi{ font-size:24px; color:var(--ink2); }
.bga-cat > span:not(.mi){ max-width:100%; overflow:hidden; text-overflow:ellipsis; }
.bga-cat.on{ border-color:var(--mint) !important; background:var(--glass3) !important; box-shadow:0 0 0 3px rgba(63,191,154,.22); }
.bga-pills{ display:flex; gap:8px; flex-wrap:wrap; }
.bga-pill{ height:42px; padding:0 14px !important; border-radius:999px !important; border:1px solid var(--edge) !important; background:var(--glass2) !important; display:inline-flex; align-items:center; gap:6px; font:700 13px var(--font) !important; cursor:pointer; max-width:100%; }
.bga-pill > .mi{ font-size:19px; }
.bga-pill > span:not(.mi){ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bga-pill input[type="date"]{ border:0; background:none; font:700 13px var(--font); color:var(--ink); outline:none; min-width:0; }
html[data-theme="dark"] .bga-pill input[type="date"]{ color-scheme:dark; }
.bga-sp{ display:flex; flex-direction:column; gap:8px; }
.bga-sp-row{ display:flex; align-items:center; gap:12px; padding:8px 10px; border-radius:18px; background:var(--glass2); border:1px solid var(--edge); min-width:0; }
.bga-sp-row > b{ font:700 14px/1.2 var(--font); flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bga-sp-row > .bga-tube{ width:80px; }
.bga-sp-row > em{ font:800 13px var(--font); font-style:normal; min-width:72px; text-align:end; font-variant-numeric:tabular-nums; }
.bga-sp-s{ font:600 12px var(--font); color:var(--ink3); white-space:nowrap; }
.bga-pct{ display:inline-flex; align-items:center; gap:2px; font:700 12px var(--font); color:var(--ink3); }
.bga-pct > input{ width:46px; height:30px; border-radius:10px; border:1px solid var(--edge); background:var(--glass3); text-align:center; font:700 13px var(--font); color:var(--ink); }
.bga-notes{ min-height:96px; padding:12px 14px; border-radius:20px; background:var(--glass3); border:1.5px solid var(--edge); outline:none; font:500 14px/1.5 var(--font); }
.bga-notes:empty::before{ content:attr(data-ph); color:var(--ink3); }
.bga-notes :where(ul, ol){ margin:2px 0; padding-inline-start:22px; }
.bga-kbd{ font:600 11.5px/1.4 var(--font); color:var(--ink3); margin:-4px 6px 0; }
.bga-kv{ display:flex; justify-content:space-between; align-items:center; gap:12px; padding:12px 4px; border-bottom:1px solid var(--edge2); font:600 14px/1.35 var(--font); }
.bga-kv:last-child{ border-bottom:0; }
.bga-kv > span{ color:var(--ink3); min-width:0; }
.bga-kv > b{ text-align:end; min-width:0; }
.bga-kv-a{ display:inline-flex; align-items:center; gap:6px; }
.bga-kv-a > .mi{ font-size:17px; color:var(--ink2); }
.bga-card{ padding:4px 14px; border-radius:22px; }
.bga-card.bga-rich{ padding:12px 16px; font:500 14px/1.55 var(--font); }
.bga-rich :where(ul, ol){ margin:4px 0; padding-inline-start:22px; }
.bga-ladder em{ display:inline-grid; place-items:center; width:22px; height:22px; border-radius:50%; background:var(--glass3); font:800 11px var(--font); font-style:normal; margin-inline-end:8px; color:var(--ink2); }
.bga-ladder .bga-kv > span{ color:var(--ink); }
.bga-who{ display:flex; align-items:center; gap:14px; padding:12px 4px; }
.bga-who-t{ display:flex; flex-direction:column; min-width:0; }
.bga-who small{ font:600 13px var(--font); color:var(--ink3); }
.bga-who b{ font:800 30px/1.15 var(--font); letter-spacing:-.03em; font-variant-numeric:tabular-nums; }
.bga-pid{ display:flex; align-items:center; gap:12px; width:100%; padding:8px 12px 8px 8px !important; border-radius:18px !important; background:var(--glass2) !important; border:1px solid var(--edge) !important; text-align:start; }
.bga-pid-t{ flex:1; min-width:0; display:flex; flex-direction:column; }
.bga-pid small{ font:600 11.5px var(--font); color:var(--ink3); }
.bga-pid b{ font:700 14px/1.3 var(--font); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bga-pid > .mi{ font-size:18px; color:var(--ink3); }
.bga-drop{ display:flex; align-items:center; gap:10px; padding:14px; border-radius:20px; border:1.5px dashed var(--ink3); color:var(--ink2); font:700 13.5px var(--font); cursor:pointer; }
.bga-drop > .mi{ font-size:22px; }
.bga-search{ display:flex; align-items:center; gap:8px; height:50px; padding:0 14px; border-radius:18px; border:1.5px solid var(--edge); background:var(--glass3); }
.bga-search > .mi{ color:var(--ink3); }
.bga-search > input{ flex:1; min-width:0; border:0; background:none; outline:none; font:600 15px var(--font); color:var(--ink); }
.bga-stand{ padding:16px 18px; border-radius:22px; display:flex; flex-direction:column; gap:2px; }
.bga-stand small{ font:600 13px var(--font); color:var(--ink3); }
.bga-stand b{ font:800 30px/1.15 var(--font); letter-spacing:-.03em; }
.bga-pane{ display:flex; flex-direction:column; gap:12px; }
.bga-tl{ display:flex; flex-direction:column; padding:6px 0; position:relative; }
.bga-tl-n{ display:flex; align-items:center; gap:12px; padding:8px 4px; position:relative; }
.bga-tl-n::before{ content:''; position:absolute; inset-inline-start:16px; top:0; bottom:0; width:2px; background:var(--edge2); }
.bga-tl-n:first-child::before{ top:50%; } .bga-tl-n:last-child::before{ bottom:50%; }
.bga-tl-n > .mi, .bga-tl-n > i{ position:relative; z-index:1; width:34px; height:34px; border-radius:50%; display:grid; place-items:center; background:var(--glass3); border:1px solid var(--edge); flex:none; font-size:18px; color:var(--ink2); }
.bga-tl-n > i::after{ content:''; width:10px; height:10px; border-radius:50%; background:var(--mint); }
.bga-tl-t{ display:flex; flex-direction:column; min-width:0; }
.bga-tl-n b{ font:700 14px/1.3 var(--font); }
.bga-tl-n small{ font:600 12px var(--font); color:var(--ink3); }
/* the trip chat — the ONE shared chat (B64 S1), Budget's skin */
.bga-sl.is-trip{ padding-bottom:0; }
.bga-chat-host{ min-height:52vh; display:flex; flex-direction:column; }
.bga-chat-host .wl-chat-slide{ display:flex; flex-direction:column; flex:1; gap:8px; font-family:var(--font); }
.bga-chat-host .wl-chat-msgs{ flex:1; }
.bga-chat-host .wl-chat-composer{ position:sticky; bottom:0; padding:8px 0 12px; background:linear-gradient(transparent, var(--pop) 30%); }
.bga-chat-host .composer{ border-radius:22px !important; border:1.5px solid var(--edge) !important; background:var(--glass3) !important; box-shadow:none !important; }
.bga-chat-host .wl-chat-tools .ct-act{ border-radius:50%; background:var(--glass2); border:1px solid var(--edge); }

/* ── signed out ─────────────────────────────────────────────────── */
.bga-out{ position:relative; z-index:1; min-height:100dvh; display:grid; place-items:center; padding:24px; }
.bga-out-card{ width:min(420px, 100%); border-radius:32px; padding:32px 26px; display:flex; flex-direction:column; align-items:center; gap:10px; text-align:center; }
.bga-out-card h1{ margin:6px 0 0; font:800 40px/1 var(--font); letter-spacing:-.03em; }
.bga-out-card .mk-by{ font-size:12px; }
.bga-out-card p{ margin:6px 0 8px; color:var(--ink2); font:500 15px/1.5 var(--font); }
.bga-out-card .bga-full{ width:100%; flex:none; }
.bga-out-card .bga-langs{ width:100%; padding:8px 0 0; }

/* ── TABLET (and small laptops): icon-only tabs, sheets from the bottom ── */
@media (max-width:1024px) and (min-height:561px), (max-width:1024px) and (orientation:portrait){
  .bga-nav .bga-tab{ padding:0 12px; }
  .bga-nav .bga-tab > span:not(.mi){ display:none; }
  .bga-hero, .bga-cols, .bga-hh{ grid-template-columns:minmax(0,1fr); }
  .bga-stack{ grid-template-rows:auto; grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
  .bga-sheet{ top:auto; bottom:0; inset-inline:0; width:100%; height:86dvh; border-radius:30px 30px 0 0; transform:translateY(105%); }
  [dir="rtl"] .bga-sheet{ transform:translateY(105%); }
  .bga-sheet.open{ transform:none; }
  .bga-grab{ display:block; }
}
/* ── PHONE PORTRAIT: tabs at the bottom, the + above them ───────── */
@media (max-width:720px) and (orientation:portrait){
  .bga{ --bar-h:58px; }
  .bga-bar{ top:10px; inset-inline:10px; padding:6px 8px 6px 6px; }
  .bga-nav{ display:none; }
  .bga-bar .ast-sub-launch .ast-sub-lbl{ display:none; }
  .bga-bar .ast-sub-launch{ width:42px; padding:0 !important; justify-content:center; }
  .bga-main{ padding:calc(var(--bar-h) + 22px) 14px 150px; }
  .bga-stack{ grid-template-columns:minmax(0,1fr); }
  .bga-bal{ padding:22px 20px; min-height:190px; }
  .bga-accts{ grid-auto-columns:78%; }
  .bga-tabs{ display:flex; position:fixed; inset-inline:10px; bottom:10px; z-index:30; justify-content:space-around; padding:6px; border-radius:30px; }
  .bga-tabs .bga-tab{ flex:1 1 0; min-width:0; display:flex; flex-direction:column; align-items:center; gap:2px; padding:6px 2px; border-radius:22px; color:var(--ink3); font:700 10px/1.15 var(--font); }
  .bga-tabs .bga-tab > .mi{ font-size:22px; }
  .bga-tabs .bga-tab > span:not(.mi){ max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .bga-tabs .bga-tab.on{ color:var(--ink); background:var(--glass3); }
  .bga-fab{ bottom:90px; inset-inline-end:14px; width:58px; height:58px; border-radius:22px !important; }
  .bga-bloom{ inset-inline:10px; bottom:158px; width:auto; }
  .bga-menu{ top:74px; inset-inline-end:10px; }
  .bga-cap > button{ padding:0 4px; font-size:12px; gap:4px; }
  .bga-cap .bga-n{ min-width:18px; height:18px; padding:0 5px; font-size:10px; line-height:18px; }
  .bga-sheet{ height:92dvh; }
  .bga-sl{ padding:4px 14px 20px; }
  .bga-cats{ grid-template-columns:repeat(4, minmax(0,1fr)); }
  .bga-cats.is-5{ grid-template-columns:repeat(3, minmax(0,1fr)); }
  .bga-row{ padding:10px 8px; gap:12px; }
  .bga-coin, .bga-av.bga-coin{ width:42px; height:42px; }
  .bga-row-m > b{ font-size:14.5px; }
  .bga-row-v > b{ font-size:14.5px; }
  .bga-split3{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
  .bga-split3 > div:last-child{ grid-column:1 / -1; }
  .bga-sp-row > .bga-tube{ display:none; }
  .bga-hh-card{ padding:18px; }
  .bga-sec-h h2{ font-size:19px; }
  .bga-sec-r .bga-orb{ display:none; }
  .bga-tgrid, .bga-agrid{ grid-template-columns:minmax(0,1fr); }
}
@media (max-width:360px) and (orientation:portrait){
  .bga-tabs .bga-tab > span:not(.mi){ font-size:9px; }
  .bga-cap > button{ font-size:11px; }
  .bga-cap .bga-n{ display:none; }
}
/* ── PHONE LANDSCAPE: the bars become rails; sheets from the side ─ */
@media (orientation:landscape) and (max-height:560px){
  .bga{ --bar-h:0px; }
  .bga-bar{ top:8px; bottom:8px; inset-inline-start:8px; inset-inline-end:auto; width:64px; flex-direction:column; justify-content:space-between; border-radius:26px; padding:8px 0; gap:4px; }
  .bga-brand{ padding:0; } .bga-brand-t{ display:none; }
  .bga-nav{ display:none; } .bga-bar > .bga-sp{ display:none; }
  .bga-bar .ast-sub-launch .ast-sub-lbl{ display:none; }
  .bga-bar .ast-sub-launch{ width:42px; padding:0 !important; justify-content:center; }
  .bga-tabs{ display:flex; position:fixed; top:8px; bottom:8px; inset-inline-end:8px; z-index:30; width:72px; flex-direction:column; justify-content:center; gap:2px; padding:6px; border-radius:26px; }
  .bga-tabs .bga-tab{ display:flex; flex-direction:column; align-items:center; gap:2px; padding:5px 2px; border-radius:16px; color:var(--ink3); font:700 9.5px/1.15 var(--font); }
  .bga-tabs .bga-tab > .mi{ font-size:21px; }
  .bga-tabs .bga-tab > span:not(.mi){ max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .bga-tabs .bga-tab.on{ color:var(--ink); background:var(--glass3); }
  .bga-main{ padding:12px 96px 30px 88px; }
  [dir="rtl"] .bga-main{ padding:12px 88px 30px 96px; }
  .bga-capwrap{ top:8px; }
  .bga-hero{ grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); }
  .bga-stack{ grid-template-columns:minmax(0,1fr); grid-template-rows:auto; }
  .bga-bal{ min-height:180px; padding:20px 22px; }
  .bga-cols{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
  .bga-hh{ grid-template-columns:minmax(0,1fr); }
  .bga-fab{ inset-inline-end:92px; bottom:12px; width:52px; height:52px; border-radius:20px !important; }
  .bga-bloom{ inset-inline-end:92px; bottom:72px; width:320px; }
  .bga-menu{ top:8px; inset-inline-start:80px; inset-inline-end:auto; }
  .bga-sheet{ top:8px; bottom:8px; inset-inline-end:8px; width:min(460px, calc(100% - 96px)); }
  .bga-amt-in.is-big{ font-size:36px; }
}

/* ── B66 W10 ─────────────────────────────────────────────────────── */
/* Home: Needs you + Next up first (178 · R2-13 · 14) */
.bga-first{ margin-bottom:18px; }
.bga-grp{ padding:10px 12px 4px; font:800 10.5px/1 var(--font); letter-spacing:.1em; text-transform:uppercase; color:var(--ink3); }
.bga-date{ width:46px; height:46px; border-radius:16px; display:grid; place-content:center; text-align:center; background:var(--glass3); border:1px solid var(--edge); flex:none; line-height:1; color:var(--ink); }
.bga-date > b{ font:800 16px/1 var(--font); }
.bga-date > small{ display:block; margin-top:2px; font:800 9.5px/1 var(--font); letter-spacing:.06em; text-transform:uppercase; color:var(--ink3); }
.bga-date.is-act{ background:linear-gradient(135deg, var(--mint), var(--lime)); border-color:transparent; color:#06231d; }
.bga-date.is-act > small{ color:#06231d; opacity:.75; }
.bga-date.is-lg{ width:60px; height:60px; border-radius:20px; } .bga-date.is-lg > b{ font-size:22px; }
.bga-nu .bga-row-acts .bga-bt{ height:34px; }
/* Accounts: the composition stays put, brighter, logos + % on phones (184 · 185 · 186 · R2-17) */
.bga-view.is-accounts .bga-comp{ position:sticky; top:84px; z-index:6; background:var(--glass3); }
.bga-comp-bar > span{ opacity:1; filter:saturate(1.35) brightness(1.12); }
.bga-comp-k{ gap:8px; }
.bga-comp-k > span{ height:32px; padding:0 12px 0 5px; border-radius:999px; background:var(--glass2); border:1px solid var(--edge); font:700 12.5px var(--font); color:var(--ink2); }
.bga-comp-k > span > em{ font-style:normal; max-width:150px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bga-comp-k > span > b{ font-weight:800; color:var(--ink); }
.bga-comp-k .bga-logo.is-xs{ width:22px; height:22px; border-radius:50%; }
/* the + bloom holds eleven actions now */
.bga-bloom{ max-height:calc(100dvh - 140px); overflow:auto; }
/* Events calendar (187 · 188 · R2-19) */
.bga-cal-h{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin:0 4px 14px; }
.bga-cal-h h2{ margin:0; flex:1; min-width:140px; font:800 21px/1.2 var(--font); letter-spacing:-.025em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.bga-cal-h .bga-cap{ flex:0 0 auto; }
.bga-cal-h .bga-cap > button{ height:36px; padding:0 12px; font-size:12.5px; flex:0 0 auto; }
.bga-yr{ display:grid; grid-template-columns:repeat(auto-fill, minmax(210px, 1fr)); gap:12px; }
.bga-mini-m{ border-radius:22px !important; padding:12px !important; text-align:start; display:block; }
.bga-mini-m > b{ display:block; margin-bottom:8px; font:800 14px var(--font); text-transform:capitalize; }
.bga-mg{ display:grid; grid-template-columns:repeat(7, 1fr); gap:2px; }
.bga-mg > i{ display:grid; place-items:center; height:22px; border-radius:7px; font:600 10.5px var(--font); font-style:normal; color:var(--ink3); }
.bga-mg > i.is-today{ outline:1.5px solid var(--mint-d); color:var(--ink); }
.bga-mg > i[class*="is-"]:not(.is-today){ color:#06231d; }
.bga-mgrid{ display:grid; grid-template-columns:repeat(7, minmax(0, 1fr)); gap:6px; }
.bga-dw{ padding:4px 0; text-align:center; font:800 11px var(--font); letter-spacing:.06em; text-transform:uppercase; color:var(--ink3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.bga-cday{ min-height:104px; min-width:0; padding:6px; border-radius:16px; background:var(--glass); border:1px solid var(--edge); display:flex; flex-direction:column; gap:3px; cursor:pointer; }
.bga-mgrid.is-wk .bga-cday{ min-height:240px; }
.bga-cday.is-mute{ opacity:.35; cursor:default; }
.bga-cday.is-today{ border-color:var(--mint-d); box-shadow:0 0 0 2px rgba(63,191,154,.25); }
.bga-cday > span{ font:800 12px var(--font); color:var(--ink2); }
.bga-ev{ display:block; padding:3px 6px; border-radius:7px; font:700 11px/1.3 var(--font); color:#06231d; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; cursor:pointer; }
/* B67 R67-059 — in a month cell the day-number rule (`.bga-cday > span`, ink2) out-ranked this colour: in dark the chip kept its
   pastel and took the dark theme's light ink — "Rent", "Jericó long weekend" at 1.1–1.3:1, unreadable. The chip's own ink wins. */
.bga-cday > .bga-ev{ color:#06231d; }
.bga-ev.is-trip, .bga-mg > i.is-trip{ background:#bfefff; } .bga-ev.is-ev, .bga-mg > i.is-ev{ background:#ffd9e2; } .bga-ev.is-mt, .bga-mg > i.is-mt{ background:#e3e0ff; }
.bga-ev.is-goal, .bga-mg > i.is-goal{ background:#e9fbc4; } .bga-ev.is-bill, .bga-mg > i.is-bill, .bga-ev.is-contract, .bga-mg > i.is-contract{ background:#ffeec2; } .bga-ev.is-loan, .bga-mg > i.is-loan{ background:#d8f7ea; }
.bga-coin.is-trip{ background:#bfefff; color:#0b3a4a; } .bga-coin.is-ev{ background:#ffd9e2; color:#6b1d33; } .bga-coin.is-mt{ background:#e3e0ff; color:#2c2463; }
.bga-coin.is-goal{ background:#e9fbc4; color:#33480b; } .bga-coin.is-bill, .bga-coin.is-contract{ background:#ffeec2; color:#5c3f05; } .bga-coin.is-loan{ background:#d8f7ea; color:#0d4a37; }
/* the amount: the currency is a dropdown at its start, the field has no stray border (189) */
.bga-amt{ position:relative; flex-direction:row; align-items:center; text-align:start; gap:12px; padding:12px 18px 12px 12px; border:1.5px solid var(--edge); transition:border-color .15s; }
.bga-amt:focus-within{ border-color:var(--mint); }
.bga-amt > .bga-cur{ flex:none; height:40px; }
.bga-amt > .bga-amt-in{ flex:1; min-width:0; text-align:start; border:0 !important; box-shadow:none !important; outline:0 !important; }
.bga-amt > .bga-err{ position:absolute; inset-inline-start:18px; bottom:-20px; }
.bga-amt > .bga-curs{ position:absolute; z-index:20; top:calc(100% + 6px); inset-inline-start:8px; flex-direction:column; flex-wrap:nowrap; gap:2px; width:160px; padding:6px; border-radius:18px; background:var(--glass3); border:1px solid var(--edge); box-shadow:0 18px 40px -16px rgba(6,35,29,.35); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); }
.bga-amt > .bga-curs .bga-chip{ width:100%; justify-content:flex-start; height:38px; border:0 !important; background:none !important; box-shadow:none !important; }
.bga-amt > .bga-curs .bga-chip.on, .bga-amt > .bga-curs .bga-chip:hover{ background:var(--glass2) !important; }
.bga-amt.is-lock{ flex-direction:column; align-items:center; text-align:center; }
/* people for hundreds of contacts (190) */
.bga-pp{ border-radius:22px; padding:8px; background:var(--glass2); border:1px solid var(--edge); display:flex; flex-direction:column; gap:6px; }
.bga-pp-s{ display:flex; align-items:center; gap:8px; height:44px; padding:0 12px; border-radius:16px; background:var(--glass3); border:1.5px solid var(--edge); }
.bga-pp-s:focus-within{ border-color:var(--mint); }
.bga-pp-s > .mi{ color:var(--ink3); font-size:20px; }
.bga-pp-s > input{ flex:1; min-width:0; border:0; background:none; outline:none; font:600 14.5px var(--font); color:var(--ink); }
.bga-pp-chips{ display:flex; flex-wrap:wrap; gap:6px; }
.bga-pp-chips:empty{ display:none; }
.bga-ppc{ display:inline-flex; align-items:center; gap:6px; height:32px; padding:0 2px 0 3px; border-radius:999px; background:var(--glass3); border:1px solid var(--edge); font:700 12.5px var(--font); }
.bga-ppc > button{ width:26px; height:26px; border-radius:50%; display:grid; place-items:center; color:var(--ink2); }
.bga-ppc > button > .mi{ font-size:16px; }
.bga-pp-res{ display:flex; flex-direction:column; max-height:240px; overflow:auto; }
.bga-pp-res .bga-grp{ padding:6px 8px 4px; }
.bga-ppr{ display:flex; align-items:center; gap:10px; width:100%; padding:6px 8px !important; border-radius:14px !important; text-align:start; font:600 14px var(--font) !important; }
.bga-ppr:hover{ background:var(--glass3) !important; }
.bga-ppr > span:not(.mi):not(.bga-av){ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bga-ppr > .mi{ color:var(--mint-d); }
.bga-av.is-xs{ width:22px; height:22px; font-size:9px; }
/* categories that nest + your own (192) */
.bga-cat.is-add{ border-style:dashed !important; background:transparent !important; }
.bga-subs{ display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
.bga-subs:empty{ display:none; }
.bga-subs .bga-chip{ height:34px; padding:0 12px !important; font-size:12.5px; }
.bga-pickrow.is-wrap{ flex-wrap:wrap; overflow:visible; }
/* items, fees, the total (193) */
.bga-it{ display:flex; flex-direction:column; gap:6px; padding:8px; margin-top:6px; border-radius:18px; background:var(--glass2); border:1px solid var(--edge); }
.bga-it-r{ display:grid; grid-template-columns:minmax(0,1fr) 64px 104px auto; gap:6px; align-items:center; }
.bga-it-r .bga-in, .bga-fee .bga-in{ height:42px; width:100%; }
.bga-it-who{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; }
.bga-it-who > small{ font:700 11px var(--font); color:var(--ink3); margin-inline-end:4px; }
.bga-chip.is-xs{ height:30px; padding:0 10px 0 4px !important; font-size:12px; gap:5px; }
.bga-chip.is-xs:not(.on){ opacity:.55; }
.bga-fee{ display:grid; grid-template-columns:auto minmax(0,1fr) auto 96px auto; gap:8px; align-items:center; margin-top:6px; }
.bga-fee > b{ font:700 13.5px var(--font); }
.bga-mini-seg{ display:inline-flex; padding:3px; border-radius:999px; background:var(--glass2); border:1px solid var(--edge); }
.bga-mini-seg > button{ height:30px; min-width:38px; padding:0 8px !important; border-radius:999px !important; font:800 11.5px var(--font) !important; color:var(--ink2); }
.bga-mini-seg > button.on{ background:var(--glass3) !important; color:var(--ink); box-shadow:0 1px 3px rgba(6,35,29,.12); }
.bga-sum, .bga-plan{ margin-top:8px; padding:6px 14px; }
.bga-sum .bga-kv:last-child, .bga-plan .bga-kv:last-child{ font-weight:800; }
/* a loan: interest and its payment plan (194) */
.bga-loan{ display:flex; flex-direction:column; gap:8px; margin-top:6px; }
.bga-tgl{ display:flex; align-items:center; gap:12px; width:100%; padding:12px 14px !important; border-radius:20px !important; background:var(--glass2) !important; border:1px solid var(--edge) !important; text-align:start; }
.bga-tgl > span{ flex:1; min-width:0; }
.bga-tgl b{ display:block; font:800 14px var(--font); }
.bga-tgl small{ display:block; font:600 12px var(--font); color:var(--ink3); }
.bga-sw{ position:relative; width:46px; height:28px; border-radius:999px; background:var(--edge2); flex:none; transition:background .15s; }
.bga-sw::after{ content:""; position:absolute; top:3px; inset-inline-start:3px; width:22px; height:22px; border-radius:50%; background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.2); transition:inset-inline-start .15s; }
.bga-sw.on{ background:var(--mint-d); } .bga-sw.on::after{ inset-inline-start:21px; }
.bga-loan .bga-cap{ margin-bottom:4px; }
/* a trip's destinations, ranked by drag (196) */
.bga-dests{ display:flex; flex-direction:column; gap:8px; }
.bga-dest{ display:flex; align-items:center; gap:8px; padding:8px; border-radius:20px; }
.bga-grip{ cursor:grab; color:var(--ink3); display:grid; place-items:center; width:28px; flex:none; touch-action:none; }
.bga-dest-f{ flex:1; min-width:0; display:flex; flex-direction:column; gap:6px; }
.bga-dest-f .bga-in{ height:42px; }
/* an event's card */
.bga-evc{ display:flex; align-items:center; gap:14px; padding:14px; }
.bga-evc-t{ display:flex; flex-direction:column; gap:4px; min-width:0; }
.bga-evc-t > b{ font:800 15px var(--font); text-transform:capitalize; }
.bga-evc-t > small{ display:inline-flex; align-items:center; gap:4px; font:600 12.5px var(--font); color:var(--ink3); }
.bga-evc-t > small > .mi{ font-size:16px; }
/* the catalog list (201) */
.bga-tree, .bga-tree-p{ padding-inline-start:calc(12px + var(--d, 0) * 18px) !important; }
.bga-tree .bga-coin, .bga-tree-p .bga-coin{ width:38px; height:38px; } .bga-tree .bga-coin > .mi, .bga-tree-p .bga-coin > .mi{ font-size:19px; }
.bga-pref.is-pref{ border-color:var(--mint) !important; background:rgba(63,191,154,.18) !important; }
.bga-pref.is-never{ border-color:var(--rose) !important; background:rgba(255,143,163,.16) !important; text-decoration:line-through; }
.bga-pref.is-never > .mi{ color:#b3334f; } .bga-pref.is-pref > .mi{ color:var(--mint-d); }
.bga-pref-key{ display:flex; gap:8px; margin-top:12px; opacity:.8; }
.bga-pref-key .bga-chip{ height:30px; font-size:11.5px; pointer-events:none; }
@media (max-width:720px) and (orientation:portrait){
  .bga-view.is-accounts .bga-comp{ top:70px; }
  .bga-comp-k > span > em{ display:none; }
  .bga-comp-k > span{ padding:0 10px 0 4px; }
  .bga-cday{ min-height:58px; padding:4px; border-radius:12px; }
  /* B67 R67-016 — `.bga-cday > .bga-ev`: the day-number rule `.bga-cday > span` out-ranked the plain `.bga-ev` here, so the
     bars kept 12 px text cut in half inside 6 px ("Ren", "Jeri") */
  .bga-ev, .bga-cday > .bga-ev{ font-size:0; color:transparent; height:6px; padding:0; border-radius:3px; }
  .bga-mgrid.is-wk .bga-ev, .bga-mgrid.is-wk .bga-cday > .bga-ev{ font-size:10px; color:#06231d; height:auto; padding:3px 5px; }
  .bga-cal-h h2{ order:-1; flex-basis:100%; }
  .bga-it-r{ grid-template-columns:minmax(0,1fr) 54px 86px auto; }
  .bga-fee{ grid-template-columns:auto minmax(0,1fr) auto 76px auto; }
}
@media (orientation:landscape) and (max-height:560px){
  .bga-view.is-accounts .bga-comp{ top:8px; }
}

/* Audit A (Pablo 2026-10-07) — Mocca's date-time picker, dressed in Mint (date-field.js opens it) */
html[data-app="budget"] .cb-date-pop{ --accent:#1f9d7a; --accent-fg:#fff; --mk-blue-400:#3fbf9a; --bg-1:#fafffd; --bg-input:#fff;
  --fg-1:#06231d; --fg-2:#2f5a50; --fg-3:#557a71; --border:rgba(6,35,29,.12); --divider:rgba(6,35,29,.08);
  --mk-font-ui:'Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',sans-serif; }
html[data-app="budget"][data-theme="dark"] .cb-date-pop{ --accent:#7ff0c7; --accent-fg:#05312a; --mk-blue-400:#7ff0c7; --bg-1:#0a221c; --bg-input:#123a32;
  --fg-1:#e9fff8; --fg-2:#b5e3d5; --fg-3:#86b9ab; --border:rgba(159,240,212,.2); --divider:rgba(159,240,212,.12); }


/* B67 R67-014 — in Arabic a Latin name truncated at its START ("…s-Cola Company"): the box takes its direction from
   its own text, so Latin truncates at its end and Arabic still at its start; alignment stays on the right. */
html[dir="rtl"] .bga-ev, html[dir="rtl"] .bga-row-m > b{ unicode-bidi:plaintext; text-align:right; }

/* B67 R67-034 — the closed + bloom was transparent but its 11 buttons stayed in the Tab order */
.bga-bloom:not(.open){ visibility:hidden; transition:transform .35s cubic-bezier(.3,1.4,.5,1), opacity .2s, visibility 0s linear .35s; }
.bga-bloom.open{ visibility:visible; transition:transform .35s cubic-bezier(.3,1.4,.5,1), opacity .2s, visibility 0s; }