/* Ledger web app. Tokens copied from style-guide.html (the visual source of truth).
   Components never hardcode colors: always var(--*). Mobile first: base = 360 px. */
:root{
  --brand-300:#A5A8FF; --brand-400:#8285FA; --brand-500:#5E5CE6; --brand-600:#4B47CC; --brand-700:#3A36A3;
  --font:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,Consolas,monospace;
  --fs-xs:12px; --fs-sm:14px; --fs-md:16px; --fs-lg:18px; --fs-xl:22px; --fs-2xl:28px; --fs-3xl:34px;
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:20px; --sp-6:24px; --sp-8:32px; --sp-10:40px;
  --r-sm:8px; --r-md:12px; --r-lg:16px; --r-xl:24px; --r-full:999px;
  --tap:48px; --gutter:16px; --bottom-nav:64px; --side-nav:232px;
  --ease:cubic-bezier(.2,.8,.2,1);

  --bg:#F6F6FA; --surface:#FFFFFF; --surface-2:#F0F0F6; --surface-3:#E6E6EF;
  --border:#E2E2EC; --border-strong:#C8C8D6;
  --text:#14141F; --text-2:#4D4D5E; --text-3:#85859A; --text-inv:#FFFFFF;
  --brand:var(--brand-500); --brand-soft:rgba(94,92,230,.10); --brand-line:rgba(94,92,230,.35); --on-brand:#FFFFFF;
  --income:#12A150; --income-soft:rgba(18,161,80,.12);
  --expense:#E0393E; --expense-soft:rgba(224,57,62,.12);
  --warn:#C27C0E; --warn-soft:rgba(194,124,14,.14);
  --info:#2F7FD8; --info-soft:rgba(47,127,216,.12);
  --chat-bg:#ECEBF4; --bubble-out:#E2E1FF; --bubble-in:#FFFFFF;
  --shadow-1:0 1px 2px rgba(20,20,31,.06),0 1px 3px rgba(20,20,31,.06);
  --shadow-2:0 8px 24px rgba(20,20,31,.10);
  --shadow-3:0 -8px 32px rgba(20,20,31,.16);
  --scrim:rgba(10,10,20,.45);
  color-scheme:light;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#0B0B12; --surface:#14141D; --surface-2:#1B1B26; --surface-3:#252532;
    --border:#272735; --border-strong:#3A3A4C;
    --text:#F4F4FA; --text-2:#B5B5C6; --text-3:#7E7E93; --text-inv:#0B0B12;
    --brand:var(--brand-400); --brand-soft:rgba(130,133,250,.14); --brand-line:rgba(130,133,250,.40); --on-brand:#0B0B12;
    --income:#2BCB72; --income-soft:rgba(43,203,114,.14);
    --expense:#FF5A5F; --expense-soft:rgba(255,90,95,.14);
    --warn:#F0A93B; --warn-soft:rgba(240,169,59,.14);
    --info:#5AA2F0; --info-soft:rgba(90,162,240,.14);
    --chat-bg:#0E0E17; --bubble-out:#2D2B66; --bubble-in:#1C1C28;
    --shadow-1:0 1px 2px rgba(0,0,0,.4); --shadow-2:0 8px 24px rgba(0,0,0,.5); --shadow-3:0 -8px 32px rgba(0,0,0,.6);
    --scrim:rgba(0,0,0,.6);
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#0B0B12; --surface:#14141D; --surface-2:#1B1B26; --surface-3:#252532;
  --border:#272735; --border-strong:#3A3A4C;
  --text:#F4F4FA; --text-2:#B5B5C6; --text-3:#7E7E93; --text-inv:#0B0B12;
  --brand:var(--brand-400); --brand-soft:rgba(130,133,250,.14); --brand-line:rgba(130,133,250,.40); --on-brand:#0B0B12;
  --income:#2BCB72; --income-soft:rgba(43,203,114,.14);
  --expense:#FF5A5F; --expense-soft:rgba(255,90,95,.14);
  --warn:#F0A93B; --warn-soft:rgba(240,169,59,.14);
  --info:#5AA2F0; --info-soft:rgba(90,162,240,.14);
  --chat-bg:#0E0E17; --bubble-out:#2D2B66; --bubble-in:#1C1C28;
  --shadow-1:0 1px 2px rgba(0,0,0,.4); --shadow-2:0 8px 24px rgba(0,0,0,.5); --shadow-3:0 -8px 32px rgba(0,0,0,.6);
  --scrim:rgba(0,0,0,.6);
  color-scheme:dark;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--text);font:400 var(--fs-md)/1.5 var(--font);-webkit-font-smoothing:antialiased;overflow-x:hidden;min-height:100dvh}
button{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
.hidden{display:none!important}
.muted{color:var(--text-3)}
.num{font-family:var(--mono);font-variant-numeric:tabular-nums}

.boot{min-height:100dvh;display:grid;place-items:center;color:var(--brand)}
.spinner{width:22px;height:22px;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;animation:spin .7s linear infinite}
.spinner.sm{width:18px;height:18px}
@keyframes spin{to{transform:rotate(360deg)}}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);min-height:var(--tap);padding:0 var(--sp-5);border-radius:var(--r-md);border:1px solid transparent;font-weight:600;cursor:pointer;transition:transform .12s var(--ease),opacity .15s;-webkit-tap-highlight-color:transparent;text-decoration:none}
.btn:active{transform:scale(.97)}
.btn[disabled]{opacity:.45;pointer-events:none}
.btn-primary{background:var(--brand);color:var(--on-brand)}
.btn-secondary{background:var(--surface);color:var(--text);border-color:var(--border-strong)}
.btn-ghost{background:transparent;color:var(--brand)}
.btn-danger{background:var(--expense-soft);color:var(--expense)}
.btn-block{width:100%}
.btn-sm{min-height:36px;padding:0 var(--sp-3);font-size:var(--fs-sm);border-radius:var(--r-sm)}
.icon-btn{width:var(--tap);height:var(--tap);display:grid;place-items:center;border-radius:var(--r-full);background:transparent;border:0;color:var(--text);cursor:pointer}
.icon-btn:active{background:var(--surface-2)}
.icon{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* ---------- Fields ---------- */
.form{display:grid;gap:var(--sp-4)}
.field{display:grid;gap:6px}
.label{font-size:var(--fs-sm);font-weight:600;color:var(--text-2)}
.input{width:100%;min-height:var(--tap);padding:0 var(--sp-4);border-radius:var(--r-md);border:1px solid var(--border-strong);background:var(--surface);color:var(--text);font:400 var(--fs-md) var(--font)}
.input:focus{outline:0;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
.input[readonly]{background:var(--surface-2);color:var(--text-2)}
.help{font-size:var(--fs-xs);color:var(--text-3)}
.form-error{font-size:var(--fs-sm);color:var(--expense);background:var(--expense-soft);padding:var(--sp-3) var(--sp-4);border-radius:var(--r-md)}
.check{display:flex;align-items:flex-start;gap:var(--sp-3);min-height:var(--tap);padding:var(--sp-3) var(--sp-4);border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface);cursor:pointer}
.check input{width:20px;height:20px;margin-top:2px;accent-color:var(--brand);flex:none}
.check b{display:block;font-size:var(--fs-sm)}
.check span{font-size:var(--fs-xs);color:var(--text-3)}

/* ---------- Badges ---------- */
.badge{display:inline-flex;align-items:center;gap:4px;height:22px;padding:0 8px;border-radius:var(--r-full);font-size:var(--fs-xs);font-weight:600;white-space:nowrap}
.badge-ok{background:var(--income-soft);color:var(--income)}
.badge-warn{background:var(--warn-soft);color:var(--warn)}
.badge-info{background:var(--info-soft);color:var(--info)}
.badge-brand{background:var(--brand-soft);color:var(--brand)}
.badge-neutral{background:var(--surface-2);color:var(--text-2)}

/* ---------- Cards / lists ---------- */
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--sp-4);box-shadow:var(--shadow-1)}
.card h2{font-size:var(--fs-lg);margin-bottom:var(--sp-2)}
.card p{color:var(--text-2);font-size:var(--fs-sm)}
.hero{background:linear-gradient(135deg,var(--brand-600),var(--brand-700));color:#FFFFFF;border:0;padding:var(--sp-5)}
.hero p{color:rgba(255,255,255,.82)}
.hero h2{font-size:var(--fs-xl)}
.btn-on-hero{margin-top:var(--sp-4);background:#FFFFFF;color:var(--brand-600)}
.list{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden}
.row{display:flex;align-items:center;gap:var(--sp-3);min-height:64px;padding:var(--sp-3) var(--sp-4);border-bottom:1px solid var(--border);width:100%;background:transparent;border-left:0;border-right:0;border-top:0;text-align:left;cursor:pointer}
.row:last-child{border-bottom:0}
a.row{color:inherit;text-decoration:none}
.card.row{border:1px solid var(--border);padding:var(--sp-3) var(--sp-4)}
.row[disabled]{cursor:default;opacity:1}
.row:active{background:var(--surface-2)}
.row-main{flex:1;min-width:0}
.row-title{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row-meta{font-size:var(--fs-xs);color:var(--text-3);display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.avatar{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:var(--fs-sm);background:var(--brand-soft);color:var(--brand);flex:none}
.avatar.off{background:var(--surface-2);color:var(--text-3)}
.meter{height:8px;border-radius:var(--r-full);background:var(--surface-3);overflow:hidden}
.meter i{display:block;height:100%;background:var(--brand);border-radius:inherit;transition:width .3s var(--ease)}
.section-head{display:flex;justify-content:space-between;align-items:baseline;gap:var(--sp-3);margin-bottom:var(--sp-2)}
.section-head b{font-size:var(--fs-md)}
.stack{display:grid;gap:var(--sp-4)}
.stack-sm{display:grid;gap:var(--sp-2)}
.alert{display:flex;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);border-radius:var(--r-md);font-size:var(--fs-sm);align-items:flex-start}
.alert-warn{background:var(--warn-soft)}
.alert-info{background:var(--info-soft)}
.kv{display:grid;grid-template-columns:auto 1fr;gap:var(--sp-2) var(--sp-4);font-size:var(--fs-sm)}
.kv dt{color:var(--text-3)}
.kv dd{text-align:right;font-weight:500}

/* ---------- Chat (own messenger: familiar layout, brand palette) ---------- */
.chat-screen{position:fixed;left:0;right:0;top:0;height:100dvh;z-index:5;display:flex;flex-direction:column;background:var(--chat-bg)}
.chat-screen .nav{display:none}
.chat-bar{display:flex;align-items:center;gap:var(--sp-2);height:60px;padding:0 var(--sp-2);padding-top:env(safe-area-inset-top);box-sizing:content-box;background:var(--surface);border-bottom:1px solid var(--border);flex:none}
.bot-avatar{width:40px;height:40px;border-radius:50%;background:var(--brand);color:var(--on-brand);display:grid;place-items:center;font-weight:700;font-size:15px;flex:none}
.chat-who{flex:1;min-width:0}
.chat-who b{display:block;font-size:var(--fs-md);line-height:1.2}
.chat-who small{font-size:var(--fs-xs);color:var(--text-3)}
.chat-who small.on{color:var(--brand)}
.chat-log{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:var(--sp-3);display:flex;flex-direction:column;gap:6px}
.chat-log>*{flex:none}
.day-sep{align-self:center;font-size:var(--fs-xs);font-weight:600;color:var(--text-2);background:var(--surface);padding:4px 10px;border-radius:var(--r-full);box-shadow:var(--shadow-1);margin:var(--sp-2) 0}
.bubble{max-width:82%;padding:8px 10px 4px;border-radius:16px;font-size:var(--fs-md);line-height:1.4;color:var(--text);box-shadow:var(--shadow-1);white-space:pre-wrap;overflow-wrap:anywhere;text-align:left;border:0;font-family:var(--font)}
.bubble.out{align-self:flex-end;background:var(--bubble-out);border-bottom-right-radius:4px}
.bubble.in{align-self:flex-start;background:var(--bubble-in);border-bottom-left-radius:4px}
button.bubble{cursor:pointer}
.bubble .meta{display:flex;justify-content:flex-end;align-items:center;gap:4px;font-size:11px;color:var(--text-3);margin-top:2px;white-space:nowrap}
.bubble .meta .icon{width:14px;height:14px;stroke-width:2.4}
.bubble .meta .ok{display:inline-flex;color:var(--brand)}
.bubble.failed{box-shadow:0 0 0 1px var(--expense)}
.bubble.failed .meta{color:var(--expense)}
.typing{align-self:flex-start;display:flex;gap:4px;padding:12px 14px;border-radius:16px;border-bottom-left-radius:4px;background:var(--bubble-in);box-shadow:var(--shadow-1)}
.typing i{width:7px;height:7px;border-radius:50%;background:var(--text-3);animation:blink 1.2s infinite}
.typing i:nth-child(2){animation-delay:.2s}
.typing i:nth-child(3){animation-delay:.4s}
@keyframes blink{0%,80%,100%{opacity:.3}40%{opacity:1}}
.load-older{align-self:center;min-height:36px;padding:0 var(--sp-4);border-radius:var(--r-full);border:1px solid var(--border);background:var(--surface);color:var(--brand);font-size:var(--fs-sm);font-weight:600;cursor:pointer}
.chat-empty{margin:auto;max-width:280px;text-align:center;display:grid;gap:4px;padding:var(--sp-6) var(--sp-4);background:var(--surface);border-radius:var(--r-lg);box-shadow:var(--shadow-1)}
.chat-empty span{font-size:var(--fs-sm);color:var(--text-2)}
.composer{display:block;padding:var(--sp-2) var(--sp-2) calc(var(--sp-2) + env(safe-area-inset-bottom));background:var(--surface);border-top:1px solid var(--border);flex:none}
.composer-field{flex:1;position:relative;display:flex}
.composer textarea{flex:1;min-height:var(--tap);max-height:132px;resize:none;padding:12px var(--sp-4);border-radius:24px;border:1px solid var(--border-strong);background:var(--surface-2);color:var(--text);font:400 var(--fs-md)/1.4 var(--font)}
.composer textarea:focus{outline:0;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
.composer-count{position:absolute;right:14px;top:-20px;font-size:11px;color:var(--text-3);background:var(--surface);padding:0 4px;border-radius:4px}
.send-btn{width:var(--tap);height:var(--tap);border-radius:50%;border:0;background:var(--brand);color:var(--on-brand);display:grid;place-items:center;flex:none;cursor:pointer}
.send-btn[disabled]{background:var(--surface-3);color:var(--text-3);pointer-events:none}
.offline-bar{display:flex;align-items:center;justify-content:center;gap:6px;background:var(--warn-soft);color:var(--text);font-size:var(--fs-xs);font-weight:600;padding:6px var(--sp-3);flex:none}
.offline-bar .icon{width:16px;height:16px}
body.in-chat #toast-root{bottom:calc(84px + env(safe-area-inset-bottom))}

/* ---------- Admin ---------- */
.kpis{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3)}
.kpi-cap{font-size:var(--fs-xs);color:var(--text-3);font-weight:500}
.kpi-val{font-size:var(--fs-xl);font-weight:600;margin-top:2px}
.kpi-sub{font-size:var(--fs-xs);color:var(--text-3)}
.list-note{margin-top:var(--sp-2)}

/* ---------- Install (PWA) ---------- */
.install{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-3);border-color:var(--brand-line);background:var(--brand-soft)}
.install img{width:48px;height:48px;border-radius:12px;flex:none}
.install b{display:block}
.install p{font-size:var(--fs-sm);color:var(--text-2)}
.install-actions{display:flex;gap:var(--sp-2);width:100%;justify-content:flex-end}

/* ---------- Login ---------- */
.login{min-height:100dvh;display:grid;align-content:center;padding:var(--sp-8) var(--gutter)}
.login-inner{width:100%;max-width:380px;margin:0 auto;display:grid;gap:var(--sp-6)}
.brand{display:flex;align-items:center;gap:var(--sp-3)}
.logo{width:44px;height:44px;border-radius:14px;background:var(--brand);color:var(--on-brand);display:grid;place-items:center;font-weight:700}
.brand b{font-size:var(--fs-xl);display:block;line-height:1.1}
.brand span{font-size:var(--fs-sm);color:var(--text-3)}

/* ---------- Shell ---------- */
.appbar{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:var(--sp-2);height:56px;padding:0 var(--sp-2) 0 var(--gutter);background:color-mix(in srgb,var(--surface) 92%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--border)}
.appbar.has-back{padding-left:var(--sp-1)}
.appbar h1{font-size:var(--fs-lg);font-weight:700;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.content{padding:var(--sp-4) var(--gutter) calc(var(--bottom-nav) + var(--sp-8) + env(safe-area-inset-bottom));max-width:720px;margin:0 auto}
.nav{position:fixed;left:0;right:0;bottom:0;z-index:20;display:grid;grid-auto-flow:column;grid-auto-columns:1fr;height:calc(var(--bottom-nav) + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);background:var(--surface);border-top:1px solid var(--border)}
.nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:11px;font-weight:600;color:var(--text-3);text-decoration:none;-webkit-tap-highlight-color:transparent}
.nav a[aria-current="page"]{color:var(--brand)}
.nav-brand{display:none}
@media (min-width:600px){:root{--gutter:24px}}
@media (min-width:960px){
  .shell{padding-left:var(--side-nav)}
  .nav{top:0;right:auto;width:var(--side-nav);height:auto;grid-auto-flow:row;grid-auto-rows:min-content;align-content:start;gap:4px;padding:var(--sp-5) var(--sp-3);border-top:0;border-right:1px solid var(--border)}
  .nav a{flex-direction:row;justify-content:flex-start;gap:var(--sp-3);font-size:var(--fs-sm);min-height:44px;padding:0 var(--sp-3);border-radius:var(--r-md)}
  .nav a[aria-current="page"]{background:var(--brand-soft)}
  .nav-brand{display:flex;margin:0 var(--sp-2) var(--sp-5)}
  .content{padding-bottom:var(--sp-10)}
  .chat-screen{left:var(--side-nav)}
  .chat-screen .nav{display:grid}
  .chat-back{display:none!important}
  .chat-bar{padding-left:var(--sp-4)}
  .chat-log{padding-left:max(var(--sp-4),calc((100% - 760px)/2));padding-right:max(var(--sp-4),calc((100% - 760px)/2))}
  body.in-chat #toast-root{left:calc(var(--side-nav) + var(--gutter))}
}

/* ---------- Sheet & toast ---------- */
.scrim{position:fixed;inset:0;z-index:40;background:var(--scrim);display:flex;align-items:flex-end;justify-content:center;animation:fade .15s ease}
.sheet{width:100%;max-width:560px;max-height:92dvh;overflow:auto;background:var(--surface);border-radius:var(--r-xl) var(--r-xl) 0 0;box-shadow:var(--shadow-3);padding:var(--sp-2) var(--gutter) calc(var(--sp-6) + env(safe-area-inset-bottom));animation:up .2s var(--ease)}
.sheet-handle{width:40px;height:4px;border-radius:2px;background:var(--border-strong);margin:0 auto var(--sp-4)}
.sheet h3{font-size:var(--fs-lg);margin-bottom:var(--sp-4)}
.sheet-actions{display:grid;gap:var(--sp-2);margin-top:var(--sp-2)}
@media (min-width:600px){.scrim{align-items:center}.sheet{border-radius:var(--r-xl)}}
@keyframes up{from{transform:translateY(24px);opacity:0}}
@keyframes fade{from{opacity:0}}
#toast-root{position:fixed;left:var(--gutter);right:var(--gutter);bottom:calc(var(--bottom-nav) + 12px + env(safe-area-inset-bottom));z-index:50;display:grid;justify-items:center;pointer-events:none}
.toast{pointer-events:auto;max-width:480px;width:100%;background:var(--text);color:var(--text-inv);padding:var(--sp-3) var(--sp-4);border-radius:var(--r-md);box-shadow:var(--shadow-2);font-size:var(--fs-sm);animation:up .2s var(--ease)}
@media (min-width:960px){#toast-root{bottom:24px}}

/* ---------- Ledger (balance, transactions, add/edit) ---------- */
.income{color:var(--income)}
.expense{color:var(--expense)}
.link{color:var(--brand);font-size:var(--fs-sm);font-weight:600;text-decoration:none}
.toast{display:flex;align-items:center;gap:var(--sp-3)}
.toast button{margin-left:auto;background:none;border:0;color:var(--brand-300);font-weight:600;font-size:var(--fs-sm);min-height:36px;cursor:pointer}
.skel-card{display:grid;place-items:center;min-height:96px;color:var(--brand)}
.balance{background:linear-gradient(135deg,var(--brand-600),var(--brand-700));color:#FFFFFF;border:0;padding:var(--sp-5)}
.balance .cap{font-size:var(--fs-sm);opacity:.85}
.balance .big{font-size:var(--fs-3xl);font-weight:600;line-height:1.15;margin:4px 0 var(--sp-4)}
.balance .split{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3)}
.balance .split div{background:rgba(255,255,255,.12);border-radius:var(--r-md);padding:var(--sp-3);min-width:0}
.balance .split small{display:block;font-size:var(--fs-xs);opacity:.85}
.balance .split b{font-size:var(--fs-sm);font-weight:600;white-space:nowrap;display:block}
.kpi-val{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kpi .kpi-val:not(.num){font-size:var(--fs-lg)}
.tx-group-head{display:flex;justify-content:space-between;font-size:var(--fs-xs);font-weight:600;color:var(--text-3);text-transform:uppercase;letter-spacing:.05em;padding:var(--sp-2) var(--sp-1)}
.tx-list{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden}
.tx{display:flex;align-items:center;gap:var(--sp-3);width:100%;min-height:64px;padding:var(--sp-3) var(--sp-4);border:0;border-bottom:1px solid var(--border);background:transparent;text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent}
.tx:last-child{border-bottom:0}
.tx:active{background:var(--surface-2)}
.tx-ic{width:40px;height:40px;border-radius:var(--r-md);display:grid;place-items:center;flex:none;font-size:18px;background:var(--surface-2)}
.tx-main{flex:1;min-width:0}
.tx-title{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tx-meta{font-size:var(--fs-xs);color:var(--text-3);display:flex;gap:6px;align-items:center;min-width:0}
.tx-meta span:first-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tx-meta .badge{flex:none}
.tx-meta .badge{height:18px}
.tx-amt{font-weight:600;white-space:nowrap}
.tx-amt.expense{color:var(--text)}
.month-totals{display:flex;gap:var(--sp-4);align-items:baseline;font-size:var(--fs-sm);font-weight:600;flex-wrap:wrap}
.month-totals .muted{margin-left:auto;font-weight:500}
.empty{text-align:center;display:grid;gap:var(--sp-2);justify-items:center;padding:var(--sp-6) var(--sp-4)}
.chips{display:flex;gap:var(--sp-2);overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
.chips::-webkit-scrollbar{display:none}
.chips.wrap{flex-wrap:wrap;overflow:visible}
.chip{flex:none;display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 var(--sp-3);border-radius:var(--r-full);border:1px solid var(--border);background:var(--surface);color:var(--text-2);font-size:var(--fs-sm);font-weight:500;cursor:pointer}
.chip[aria-pressed="true"]{background:var(--brand-soft);border-color:var(--brand-line);color:var(--brand)}
.segmented{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;background:var(--surface-2);border-radius:var(--r-md)}
.segmented button{min-height:40px;border:0;border-radius:var(--r-sm);background:transparent;color:var(--text-2);font-weight:600;font-size:var(--fs-sm);cursor:pointer}
.segmented button[aria-pressed="true"].is-expense{background:var(--surface);color:var(--expense);box-shadow:var(--shadow-1)}
.segmented button[aria-pressed="true"].is-income{background:var(--surface);color:var(--income);box-shadow:var(--shadow-1)}
.amount-input{display:flex;align-items:baseline;justify-content:center;gap:var(--sp-2);padding:var(--sp-4);border-radius:var(--r-lg);background:var(--surface-2)}
.amount-input .cur{font-size:var(--fs-xl);color:var(--text-3);font-weight:600}
.amount-input input{width:100%;max-width:260px;border:0;background:transparent;color:var(--text);font:600 var(--fs-3xl) var(--mono);text-align:center;font-variant-numeric:tabular-nums}
.amount-input input:focus{outline:0}
.fab{position:fixed;right:var(--gutter);bottom:calc(var(--bottom-nav) + 16px + env(safe-area-inset-bottom));z-index:15;width:56px;height:56px;border-radius:18px;background:var(--brand);color:var(--on-brand);border:0;display:grid;place-items:center;box-shadow:var(--shadow-2);cursor:pointer}
.fab .icon{width:26px;height:26px;stroke-width:2.4}
@media (min-width:960px){.fab{bottom:24px;right:24px}}

/* Chat receipt + quick replies */
.receipt{display:grid;gap:4px;margin:6px 0 2px;padding-top:6px;border-top:1px solid var(--border);white-space:normal}
.receipt div{display:flex;justify-content:space-between;align-items:baseline;gap:var(--sp-3);font-size:var(--fs-sm)}
.receipt .num{font-weight:600;white-space:nowrap}
.receipt .num.expense{color:var(--expense)}
.receipt .num.income{color:var(--income)}
.quick{display:flex;flex-wrap:wrap;gap:var(--sp-2);align-self:flex-start;max-width:92%}
.quick .chip{border-color:var(--brand-line);color:var(--brand);background:var(--surface)}
.receipt-note{font-size:var(--fs-xs);color:var(--text-2);margin-top:4px;white-space:normal}

/* ---------- Activity: year, months, filter; category management ---------- */
.new-tx{width:100%}
.activity-top{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);flex-wrap:wrap}
.activity-top .new-tx{width:auto}
.year-switch{display:flex;align-items:center;gap:var(--sp-1);background:var(--surface);border:1px solid var(--border);border-radius:var(--r-full);padding:2px}
.year-switch .icon-btn{width:40px;height:40px}
.year-switch .icon-btn[disabled]{opacity:.3;pointer-events:none}
.icon-btn.flip .icon{transform:rotate(180deg)}
.year-label{font-size:var(--fs-lg);min-width:4ch;text-align:center}
.select{width:100%;min-height:var(--tap);padding:0 var(--sp-4);border-radius:var(--r-md);border:1px solid var(--border-strong);background:var(--surface);color:var(--text);font:400 var(--fs-md) var(--font)}
.select:focus{outline:0;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
.activity-filter{max-width:360px}
.label-row{display:flex;justify-content:space-between;align-items:baseline;gap:var(--sp-3)}
.link-btn{background:none;border:0;color:var(--brand);font-size:var(--fs-sm);font-weight:600;cursor:pointer;min-height:32px;padding:0}
.chip-add{border-style:dashed;color:var(--brand)}
.chip-delete{border-color:var(--expense-soft);color:var(--text-2)}
.chip-delete.asking{background:var(--expense-soft);border-color:var(--expense);color:var(--expense);font-weight:600}
.chip-locked{opacity:.5;cursor:not-allowed}
.new-category{display:grid;grid-template-columns:64px 1fr auto;gap:var(--sp-2);align-items:center;margin-top:var(--sp-2)}
.new-category .btn{min-height:var(--tap)}
.icon-input{text-align:center;padding:0 var(--sp-2)}
@media (min-width:600px){.new-tx{width:auto}}
.new-category-box{display:grid;gap:var(--sp-2)}
.icon-choice{min-height:var(--tap);padding:0;font-size:22px}
.icon-picker{display:grid;grid-template-columns:repeat(auto-fill,minmax(44px,1fr));gap:4px;padding:var(--sp-2);background:var(--surface-2);border-radius:var(--r-md);max-height:200px;overflow-y:auto}
.icon-option{height:44px;border:1px solid transparent;border-radius:var(--r-sm);background:transparent;font-size:22px;cursor:pointer}
.icon-option:hover{background:var(--surface)}
.icon-option[aria-pressed="true"]{background:var(--brand-soft);border-color:var(--brand-line)}

/* Voice notes */
.composer-row{display:flex;align-items:flex-end;gap:var(--sp-2)}
.record-bar{display:flex;align-items:center;gap:var(--sp-3);min-height:var(--tap)}
.rec-dot{width:12px;height:12px;border-radius:50%;background:var(--expense);animation:pulse 1.2s ease-in-out infinite;flex:none}
.rec-label{font-weight:600;font-size:var(--fs-sm);color:var(--text-2)}
.rec-time{font-size:var(--fs-md);font-weight:600;margin-right:auto}
@keyframes pulse{50%{opacity:.35}}

/* Currencies (COP / USD): always shown apart, never added together */
.cur-switch{display:flex;justify-content:center;gap:4px;margin-top:calc(-1 * var(--sp-2))}
.cur-option{min-height:32px;padding:0 var(--sp-4);border-radius:var(--r-full);border:1px solid var(--border);background:var(--surface);color:var(--text-2);font:600 var(--fs-xs) var(--mono);cursor:pointer}
.cur-option[aria-pressed="true"]{background:var(--brand-soft);border-color:var(--brand-line);color:var(--brand)}
.nets{display:flex;gap:var(--sp-3)}
.currency-lines{display:grid;gap:2px}
.currency-line{display:flex;gap:var(--sp-4);align-items:baseline}
.cur-tag{font:600 10px var(--mono);color:var(--text-3);min-width:3ch}
.month-totals{align-items:flex-end}
.balance-usd{background:linear-gradient(135deg,var(--brand-700),var(--brand-600))}
.balance-usd .big{font-size:var(--fs-2xl)}
.kpi-second{font-size:var(--fs-md);color:var(--text-2)}

/* Recurring (subscriptions and fixed income) */
.recurring-summary{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3)}
.recurring-summary small{display:block;font-size:var(--fs-xs);color:var(--text-3)}
.recurring-summary b{font-size:var(--fs-md);font-weight:600}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3)}
details.cancelled summary{cursor:pointer;color:var(--text-2);font-size:var(--fs-sm);font-weight:600;padding:var(--sp-2) 0}
details.cancelled .tx{opacity:.6}
.admin-link{display:flex;align-items:center;gap:var(--sp-3);color:inherit;text-decoration:none}
.segmented button[disabled]{opacity:.6;cursor:default}
.segmented button[aria-pressed="true"].is-expense:disabled,.segmented button[aria-pressed="true"].is-income:disabled{opacity:1}
a.tx{color:inherit;text-decoration:none}
.rec-meta{flex-wrap:wrap;row-gap:2px}
.rec-meta span:first-child{white-space:normal;overflow:visible}