
:root{--bg:#070912;--panel:#0d1322;--panel2:#121a2d;--text:#f8fafc;--muted:#94a3b8;--line:rgba(255,255,255,.10);--accent:#8b5cf6;--cyan:#06b6d4;--green:#22c55e;--amber:#f59e0b;--red:#ef4444}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 18% 0,#24315f 0,#070912 42%,#05060a 100%);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif}button,input,select{font:inherit}.shell{max-width:1480px;margin:auto;padding:28px}.glass,.card{background:linear-gradient(180deg,rgba(255,255,255,.085),rgba(255,255,255,.035));border:1px solid var(--line);box-shadow:0 24px 80px rgba(0,0,0,.30);border-radius:28px}.hero{display:grid;grid-template-columns:1.25fr .75fr;gap:18px}.title{padding:34px}.eyebrow{color:#c4b5fd;font-weight:800;letter-spacing:.15em;text-transform:uppercase;font-size:12px}.title h1{font-size:52px;letter-spacing:-.05em;line-height:.95;margin:12px 0}.title p{color:var(--muted);max-width:820px;font-size:16px}.controls{padding:22px;display:grid;grid-template-columns:1fr 1fr;gap:12px;align-content:start}.pill{border:1px solid var(--line);border-radius:999px;padding:11px 13px;background:#0b1020;color:var(--text);width:100%}.btn{grid-column:1/-1;cursor:pointer;border:0;border-radius:16px;padding:12px 14px;background:linear-gradient(135deg,var(--accent),var(--cyan));color:white;font-weight:900}.grid{display:grid;gap:18px}.kpis{grid-template-columns:repeat(6,1fr);margin-top:18px}.card{padding:18px}.label{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.1em}.value{font-size:30px;font-weight:950;margin-top:8px;letter-spacing:-.03em}.sub{color:var(--muted);font-size:13px;margin-top:6px}.main{grid-template-columns:1.35fr .65fr;margin-top:18px}.two{grid-template-columns:1fr 1fr;margin-top:18px}.section-title{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:16px}h2{font-size:19px;margin:0}.chart{height:340px}.chart svg{width:100%;height:100%;overflow:visible}.legend{display:flex;gap:10px;flex-wrap:wrap;color:var(--muted);font-size:12px}.dot{width:9px;height:9px;border-radius:999px;display:inline-block;margin-right:6px}.table-wrap{overflow:auto;max-height:560px}table{border-collapse:collapse;width:100%;min-width:960px}th,td{padding:12px 10px;border-bottom:1px solid var(--line);text-align:left;font-size:14px}th{position:sticky;top:0;background:#12182a;z-index:1;color:#cbd5e1}td.num{text-align:right;font-variant-numeric:tabular-nums}.tag{display:inline-flex;align-items:center;border-radius:999px;padding:4px 9px;background:#1f2937;font-size:12px}.due-list{display:grid;gap:10px}.due{display:grid;grid-template-columns:1fr auto;gap:8px;padding:12px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.035)}.barbg{height:8px;background:#1f2937;border-radius:99px;overflow:hidden;margin-top:8px}.bar{height:100%;background:linear-gradient(90deg,var(--accent),var(--cyan));border-radius:99px}.insight{padding:14px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.035);color:#cbd5e1}.footer{color:var(--muted);font-size:12px;margin:22px 0}.small{font-size:12px;color:var(--muted)}@media(max-width:1120px){.hero,.main,.two,.kpis{grid-template-columns:1fr}.controls{grid-template-columns:1fr}.title h1{font-size:38px}.shell{padding:16px}}
.month-select{grid-column:1/-1;font-weight:800;background:linear-gradient(180deg,#11182b,#0b1020)}
.trend-tools{display:flex;gap:14px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.pill.compact{min-width:190px;max-width:260px}
@media (max-width: 760px){.trend-tools{justify-content:flex-start}.pill.compact{width:100%;max-width:none}}
.category-head{margin-top:18px;display:grid;grid-template-columns:1fr 1.2fr;gap:18px;align-items:center}.category-head h2{font-size:28px;letter-spacing:-.03em;margin:4px 0}.category-head p{color:var(--muted);margin:6px 0 0}.mini-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.mini-kpis div{border:1px solid var(--line);border-radius:18px;padding:12px;background:rgba(255,255,255,.035);min-height:76px}.mini-kpis span{display:block;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.08em}.mini-kpis b{display:block;margin-top:8px;font-size:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.category-grid{grid-template-columns:1.15fr .85fr;margin-top:18px}@media(max-width:1120px){.category-head,.category-grid{grid-template-columns:1fr}.mini-kpis{grid-template-columns:repeat(2,1fr)}}
.balance-card{grid-column:span 2;display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:center}.balance-split{border-left:1px solid var(--line);padding-left:16px}.value.mini{font-size:24px}.category-trend-grid{grid-template-columns:1.2fr .8fr;margin-top:18px}@media(max-width:1120px){.kpis{grid-template-columns:1fr}.balance-card{grid-column:auto;grid-template-columns:1fr}.balance-split{border-left:0;border-top:1px solid var(--line);padding-left:0;padding-top:14px}.category-trend-grid{grid-template-columns:1fr}}
@media(min-width:1121px){.kpis{grid-template-columns:repeat(7,1fr)}}
.btn.secondary{background:rgba(255,255,255,.07);border:1px solid var(--line);box-shadow:none;color:#e2e8f0}
.accounts-title{align-items:flex-start}.accounts-title .btn{width:auto;white-space:nowrap;padding:10px 14px;border-radius:14px}
.spreadsheet-toolbar{display:grid;grid-template-columns:minmax(220px,1.4fr) repeat(4,minmax(150px,1fr)) auto;gap:10px;margin-bottom:12px;align-items:center}.spreadsheet-toolbar .pill{border-radius:14px}.spreadsheet-toolbar .search{background:#0b1020;color:var(--text)}
.totals-strip{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin:10px 0 14px}.totals-strip div{border:1px solid var(--line);border-radius:16px;padding:12px;background:rgba(255,255,255,.035)}.totals-strip span{display:block;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.08em}.totals-strip b{display:block;margin-top:6px;font-size:18px}
.spreadsheet-wrap{max-height:640px;border:1px solid var(--line);border-radius:18px;background:rgba(0,0,0,.12)}.spreadsheet-wrap table{min-width:1080px}.spreadsheet-wrap th{top:0;background:#12182a;box-shadow:0 1px 0 var(--line);cursor:pointer;user-select:none}.spreadsheet-wrap th span{color:#64748b;font-size:11px;margin-left:3px}.spreadsheet-wrap th.num{text-align:right}.spreadsheet-wrap tfoot td{position:sticky;bottom:0;background:#101728;border-top:1px solid rgba(255,255,255,.20);border-bottom:0;color:#f8fafc;z-index:2}.spreadsheet-wrap tbody tr:hover{background:rgba(255,255,255,.04)}.empty-row{text-align:center;color:var(--muted);padding:28px!important}
@media(max-width:1120px){.spreadsheet-toolbar{grid-template-columns:1fr 1fr}.spreadsheet-toolbar .search{grid-column:1/-1}.spreadsheet-toolbar .btn{grid-column:1/-1}.totals-strip{grid-template-columns:1fr 1fr}.accounts-title{display:grid}.accounts-title .btn{width:100%}}

.upload-drop{border:1px dashed rgba(125,211,252,.45);border-radius:16px;padding:12px 14px;display:flex;flex-direction:column;gap:3px;cursor:pointer;background:rgba(15,23,42,.58);color:#e2e8f0;transition:.18s ease;min-height:54px;justify-content:center}
.upload-drop span{font-size:12px;color:#94a3b8;font-weight:700}.upload-drop:hover,.upload-drop.dragover{border-color:#22d3ee;background:rgba(14,165,233,.16);transform:translateY(-1px)}
.upload-status{min-height:18px}.upload-status.ok{color:#86efac}.btn.secondary{background:rgba(15,23,42,.65);border:1px solid rgba(148,163,184,.22);color:#cbd5e1}

/* iPad/tablet KPI overflow fix */
.kpis{grid-template-columns:repeat(auto-fit,minmax(170px,1fr));align-items:stretch}
.kpis .card{min-width:0;overflow:hidden}
.kpis .value{font-size:clamp(24px,2.15vw,30px);white-space:nowrap;line-height:1.05}
.balance-card{min-width:0;grid-column:span 2;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.balance-card > div,.balance-split{min-width:0;overflow:hidden}
.balance-card .label{overflow-wrap:anywhere}
.balance-card .sub{overflow-wrap:anywhere;line-height:1.25}
@media(max-width:1280px){
  .kpis{grid-template-columns:repeat(4,minmax(0,1fr))}
  .balance-card{grid-column:span 2}
}
@media(max-width:820px){
  .kpis{grid-template-columns:1fr 1fr}
  .balance-card{grid-column:1/-1}
}
@media(max-width:560px){
  .kpis{grid-template-columns:1fr}
  .balance-card{grid-template-columns:1fr}
  .balance-split{border-left:0;border-top:1px solid var(--line);padding-left:0;padding-top:14px}
}

.category-trend-legend{justify-content:flex-end;margin:-6px 0 8px;gap:14px}.category-trend-legend span{display:inline-flex;align-items:center;white-space:nowrap}.category-trend-chart{height:315px}@media(max-width:760px){.category-trend-legend{justify-content:flex-start}}
