:root{
  --bg:#0f172a; --panel:#1e293b; --panel2:#273449; --line:#334155;
  --text:#e2e8f0; --muted:#94a3b8; --accent:#38bdf8; --accent2:#22d3ee;
  --green:#34d399; --red:#f87171; --amber:#fbbf24; --purple:#a78bfa;
}
*{box-sizing:border-box}
body{margin:0;font-family:-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  background:var(--bg);color:var(--text);font-size:15px}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
.layout{display:flex;min-height:100vh}
.sidebar{width:230px;background:var(--panel);border-right:1px solid var(--line);
  padding:18px 0;position:sticky;top:0;height:100vh;overflow-y:auto}
.brand{font-weight:700;font-size:20px;padding:0 20px 16px;color:#fff;display:flex;align-items:center;gap:8px}
.brand small{color:var(--muted);font-weight:400;font-size:12px}
.nav a{display:flex;align-items:center;gap:10px;padding:9px 20px;color:var(--muted);
  border-left:3px solid transparent;font-size:14px}
.nav a:hover{background:var(--panel2);color:var(--text);text-decoration:none}
.nav a.active{color:#fff;border-left-color:var(--accent);background:var(--panel2)}
.nav .group{padding:14px 20px 6px;font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:#64748b}
.main{flex:1;padding:24px 30px;max-width:1200px;margin:0 auto;width:100%}
.topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}
.topbar h1{font-size:22px;margin:0}
.pill{background:var(--panel2);padding:6px 12px;border-radius:20px;font-size:13px;color:var(--muted)}
.grid{display:grid;gap:16px}
.cards{grid-template-columns:repeat(auto-fill,minmax(190px,1fr))}
.cols-2{grid-template-columns:1fr 1fr}
.cols-3{grid-template-columns:repeat(3,1fr)}
@media(max-width:900px){.cols-2,.cols-3{grid-template-columns:1fr}.sidebar{width:64px}
  .brand small,.nav a span,.nav .group{display:none}}
.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px}
.card h3{margin:0 0 4px;font-size:13px;color:var(--muted);font-weight:500;text-transform:uppercase;letter-spacing:.04em}
.card .val{font-size:24px;font-weight:700}
.card .sub{font-size:12px;color:var(--muted);margin-top:4px}
.pos{color:var(--green)} .neg{color:var(--red)} .warn{color:var(--amber)}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:18px;margin-bottom:18px}
.panel h2{margin:0 0 14px;font-size:16px}
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{text-align:left;padding:9px 10px;border-bottom:1px solid var(--line)}
th{color:var(--muted);font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.03em}
tr:hover td{background:var(--panel2)}
.right{text-align:right}
.btn{display:inline-block;background:var(--accent);color:#04283b;border:none;padding:9px 16px;
  border-radius:8px;font-weight:600;cursor:pointer;font-size:14px}
.btn:hover{background:var(--accent2);text-decoration:none}
.btn.sec{background:var(--panel2);color:var(--text);border:1px solid var(--line)}
.btn.danger{background:transparent;color:var(--red);border:1px solid var(--red)}
.btn.sm{padding:5px 10px;font-size:12px}
input,select,textarea{width:100%;background:var(--bg);border:1px solid var(--line);
  color:var(--text);padding:9px 11px;border-radius:8px;font-size:14px;font-family:inherit}
label{display:block;font-size:13px;color:var(--muted);margin:10px 0 5px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.badge{display:inline-block;padding:3px 9px;border-radius:12px;font-size:12px;font-weight:600}
.badge.paid{background:#064e3b;color:var(--green)}
.badge.due{background:#78350f;color:var(--amber)}
.badge.over{background:#7f1d1d;color:var(--red)}
.badge.sched{background:#1e3a5f;color:var(--accent)}
.insight{border-left:4px solid var(--accent);background:var(--panel);border-radius:10px;
  padding:14px 16px;margin-bottom:12px;border:1px solid var(--line);border-left-width:4px}
.insight.critical{border-left-color:var(--red)}
.insight.warning{border-left-color:var(--amber)}
.insight.info{border-left-color:var(--accent)}
.insight h4{margin:0 0 6px;font-size:15px}
.insight p{margin:6px 0;color:var(--text)}
.insight .meta{font-size:12px;color:var(--muted);display:flex;gap:14px;margin-top:8px;flex-wrap:wrap}
.insight .why{font-size:13px;color:var(--muted);margin-top:8px;cursor:pointer}
.insight details summary{cursor:pointer;color:var(--accent);font-size:13px}
.insight .actions{margin-top:10px;display:flex;gap:8px;flex-wrap:wrap}
.disclaimer{font-size:11px;color:#64748b;margin-top:8px;font-style:italic}
.flash{padding:11px 15px;border-radius:8px;margin-bottom:14px;font-size:14px}
.flash.error{background:#7f1d1d;color:#fecaca}
.flash.success{background:#064e3b;color:#bbf7d0}
.auth{max-width:380px;margin:8vh auto;background:var(--panel);padding:34px;border-radius:14px;border:1px solid var(--line)}
.auth h1{margin:0 0 6px;font-size:24px}
.auth p.sub{color:var(--muted);margin:0 0 22px;font-size:14px}
.progress{height:8px;background:var(--bg);border-radius:5px;overflow:hidden;margin-top:6px}
.progress > span{display:block;height:100%;background:var(--accent)}
.progress.over > span{background:var(--red)}
.chart-box{position:relative;height:280px}
.muted{color:var(--muted)}
.tag{display:inline-block;background:var(--panel2);border:1px solid var(--line);padding:1px 7px;border-radius:10px;font-size:11px;margin-right:3px}
.actionbar{display:flex;gap:10px;margin-bottom:16px;flex-wrap:wrap}
.cal{width:100%;border-collapse:collapse;table-layout:fixed}
.cal th{padding:8px;font-size:11px;color:var(--muted);text-transform:uppercase;text-align:center}
.cal td{border:1px solid var(--line);vertical-align:top;height:104px;padding:5px;width:14.28%}
.cal td.out{background:#0b1220;opacity:.5}
.cal td.today{outline:2px solid var(--accent);outline-offset:-2px}
.cal .daynum{font-size:12px;color:var(--muted);font-weight:600;margin-bottom:3px}
.cal td.today .daynum{color:var(--accent)}
.ev{display:block;font-size:10.5px;padding:2px 5px;border-radius:5px;margin-bottom:3px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ev.bill{background:#78350f;color:#fde68a}
.ev.loan{background:#7f1d1d;color:#fecaca}
.ev.payday{background:#064e3b;color:#bbf7d0}
.ev.reset{background:#1e3a5f;color:#bae6fd}
.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;margin-bottom:12px}
.legend span{display:inline-flex;align-items:center;gap:6px}
.legend i{width:12px;height:12px;border-radius:3px;display:inline-block}
.chat{display:flex;flex-direction:column;gap:12px;max-height:56vh;overflow-y:auto;padding:6px}
.msg{max-width:80%;padding:10px 14px;border-radius:12px;font-size:14px;line-height:1.5}
.msg.user{align-self:flex-end;background:var(--accent);color:#04283b;border-bottom-right-radius:3px}
.msg.bot{align-self:flex-start;background:var(--panel2);border:1px solid var(--line);border-bottom-left-radius:3px}
.msg .fn{font-size:11px;color:var(--muted);margin-top:6px;font-family:monospace}
.msg table{margin-top:8px;font-size:12px}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.chip{background:var(--panel2);border:1px solid var(--line);border-radius:16px;padding:6px 12px;
  font-size:12.5px;cursor:pointer;color:var(--text)}
.chip:hover{border-color:var(--accent);color:var(--accent)}
.askbar{display:flex;gap:8px;margin-top:14px}
.askbar input{flex:1}

/* Floating AI assistant widget */
.ai-fab{position:fixed;right:22px;bottom:22px;width:56px;height:56px;border-radius:50%;
  border:none;background:var(--accent);color:#04283b;font-size:24px;cursor:pointer;z-index:60;
  box-shadow:0 6px 20px rgba(0,0,0,.4)}
.ai-fab:hover{background:var(--accent2)}
.ai-panel{position:fixed;right:22px;bottom:88px;width:370px;max-width:calc(100vw - 44px);
  height:520px;max-height:calc(100vh - 120px);background:var(--panel);border:1px solid var(--line);
  border-radius:14px;box-shadow:0 12px 40px rgba(0,0,0,.5);z-index:60;display:none;
  flex-direction:column;overflow:hidden}
.ai-panel.open{display:flex}
.ai-head{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;
  border-bottom:1px solid var(--line);font-weight:600}
.ai-head small{font-weight:400;font-size:11px}
.ai-x{background:none;border:none;color:var(--muted);cursor:pointer;font-size:15px;padding:2px 6px;text-decoration:none}
.ai-x:hover{color:var(--text)}
.ai-body{flex:1;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:10px}
.ai-body .msg{max-width:92%}
.ai-body table{font-size:12px;margin-top:6px}
.ai-chips{display:flex;gap:6px;flex-wrap:wrap;padding:0 12px 8px}
.ai-ask{display:flex;gap:8px;padding:10px 12px;border-top:1px solid var(--line)}
.ai-ask input{flex:1}
.fn a{color:var(--accent)}
@media(max-width:560px){.ai-panel{right:10px;left:10px;width:auto}}

/* Help pages */
.help-toc{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.help-toc a{background:var(--panel2);border:1px solid var(--line);border-radius:14px;
  padding:5px 12px;font-size:13px}
.howto{scroll-margin-top:20px}
.howto ol{margin:8px 0 8px 18px;line-height:1.7}
.howto .eg{background:var(--bg);border-left:3px solid var(--accent);padding:8px 12px;
  border-radius:6px;font-size:13px;color:var(--muted);margin-top:8px}
.danger-zone{border-color:var(--red)}
.danger-zone h2{color:var(--red)}

/* Profile / forms */
.req{color:var(--red);font-weight:700}
.sec-h{font-size:13px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);
  margin:18px 0 8px;border-bottom:1px solid var(--line);padding-bottom:5px}
/* Admin tables */
.badge.admin{background:#3730a3;color:#c7d2fe}
.badge.inactive{background:#7f1d1d;color:#fecaca}
.badge.ok{background:#064e3b;color:#bbf7d0}
.badge.warn{background:#78350f;color:#fde68a}
.urow-actions{display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end}
.urow-actions form{display:inline}
.stat-strip{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:16px}
.stat-strip .card{flex:1;min-width:120px}

/* Top nav + notification bell */
.topnav{display:flex;justify-content:flex-end;align-items:center;margin-bottom:10px}
.bell-wrap{position:relative}
.bell-btn{position:relative;background:var(--panel2);border:1px solid var(--line);
  color:var(--text);border-radius:10px;padding:7px 11px;font-size:16px;cursor:pointer}
.bell-btn:hover{border-color:var(--accent)}
.bell-badge{position:absolute;top:-6px;right:-6px;background:var(--red);color:#fff;
  font-size:11px;font-weight:700;min-width:18px;height:18px;line-height:18px;text-align:center;
  border-radius:9px;padding:0 4px}
.bell-menu{position:absolute;right:0;top:44px;width:360px;max-width:90vw;background:var(--panel);
  border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 40px rgba(0,0,0,.5);
  z-index:70;display:none;overflow:hidden}
.bell-menu.open{display:block}
.bell-head{display:flex;justify-content:space-between;align-items:center;padding:11px 14px;
  border-bottom:1px solid var(--line)}
.bell-list{max-height:60vh;overflow-y:auto}
.bell-item{padding:11px 14px;border-bottom:1px solid var(--line)}
.bell-item-t{font-size:14px;font-weight:600;margin-bottom:3px}
.bell-item-m{font-size:12.5px;margin-bottom:7px}
.bell-item-a{display:flex;gap:6px;flex-wrap:wrap}
.notif-card{border-left:4px solid var(--accent);background:var(--panel);border:1px solid var(--line);
  border-left-width:4px;border-radius:10px;padding:12px 14px;margin-bottom:10px}
.notif-card.critical{border-left-color:var(--red)}
.notif-card.warning{border-left-color:var(--amber)}
.notif-card.info{border-left-color:var(--accent)}

/* Bulk preview / confirm modal */
.modal-backdrop{position:fixed;inset:0;background:rgba(2,6,23,.6);z-index:80;
  display:flex;align-items:center;justify-content:center;padding:20px}
.modal{background:var(--panel);border:1px solid var(--line);border-radius:14px;
  width:640px;max-width:96vw;box-shadow:0 20px 60px rgba(0,0,0,.55);display:flex;flex-direction:column;max-height:86vh}
.modal-head{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-bottom:1px solid var(--line)}
.modal-body{padding:14px 16px;overflow:auto}
.modal-body table{font-size:12.5px}
.modal-foot{display:flex;justify-content:flex-end;gap:8px;padding:12px 16px;border-top:1px solid var(--line)}

/* v5 sidebar dropdown */
.nav .group.nav-dd-head{cursor:pointer;display:flex;align-items:center;justify-content:space-between;user-select:none}
.nav-dd-caret{transition:transform .15s ease;font-size:10px;margin-left:6px}
.nav .group.nav-dd-head.collapsed .nav-dd-caret{transform:rotate(-90deg)}
.nav-dd-items{overflow:hidden}

/* v16-ticker: live account balance in the top nav */
.acct-ticker{margin-right:auto;display:inline-flex;align-items:center;gap:8px;
  padding:6px 12px;border:1px solid var(--border,#233);border-radius:999px;
  background:var(--panel,#0f172a);text-decoration:none;color:inherit;font-size:14px}
.acct-ticker .tk-name{color:var(--muted,#94a3b8)}
.acct-ticker .tk-bal{font-weight:700}
.acct-ticker .tk-bal.pos{color:#34d399}.acct-ticker .tk-bal.neg{color:#f87171}
.acct-ticker .tk-dot{width:8px;height:8px;border-radius:50%;background:#34d399;
  box-shadow:0 0 0 0 rgba(52,211,153,.6);animation:tkpulse 2s infinite}
@keyframes tkpulse{0%{box-shadow:0 0 0 0 rgba(52,211,153,.5)}
  70%{box-shadow:0 0 0 6px rgba(52,211,153,0)}100%{box-shadow:0 0 0 0 rgba(52,211,153,0)}}

/* v17-ticker: reconciled figure beside the balance */
.acct-ticker .tk-sep{color:var(--muted,#94a3b8);opacity:.6}
.acct-ticker .tk-recon{color:var(--muted,#94a3b8);font-size:12px;font-weight:600}