/* ============================================================
   Finance Dashboard — page-specific styles on top of Editorial Atmosphere.
   Patterns reused: .eyebrow, .heading-display, .card, .stat, .panel,
   .btn, .field-input, .tabular, .mono-meta, .pulse-dot.
   ============================================================ */

/* ----- Layout ----- */
.wrapper {
  width: 100%;
  max-width: 1440px;
  margin-inline: auto;
  padding: var(--space-5) var(--space-5) var(--space-9);
}
@media (min-width: 768px) {
  .wrapper { padding: var(--space-6) var(--space-6) var(--space-9); }
}

/* ----- Header ----- */
.dashboard-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-5);
  padding-bottom: var(--space-5);
  border-bottom: 1px solid var(--color-hairline);
  margin-bottom: var(--space-6);
  flex-wrap: wrap;
}
.dashboard-header__left { display: flex; flex-direction: column; gap: var(--space-2); min-width: 0; }
.dashboard-header__right { display: flex; align-items: center; gap: var(--space-3); flex-wrap: wrap; }
.dashboard-header h1 {
  font-family: var(--font-display);
  font-size: 1.5rem;
  font-weight: 500;
  letter-spacing: var(--tracking-tight);
  color: var(--color-text);
  margin: 0;
}
.dashboard-header h1 em {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 400;
  letter-spacing: var(--tracking-snug);
}
@media (min-width: 768px) {
  .dashboard-header h1 { font-size: 1.875rem; }
}

/* ----- Header chips ----- */
.chip {
  display: inline-flex; align-items: center; gap: var(--space-2);
  padding: 0.375rem 0.75rem;
  border-radius: 999px;
  background: var(--color-card);
  border: 1px solid var(--color-hairline);
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: var(--tracking-wide);
  color: var(--color-label);
  white-space: nowrap;
}
.chip--accent { color: var(--color-accent); border-color: var(--color-accent); }
.chip--button { cursor: pointer; transition: background var(--duration-fast); }
.chip--button:hover { background: var(--color-base); border-color: var(--color-text); color: var(--color-text); }

/* ----- Month select ----- */
.month-select {
  background: var(--color-card);
  border: 1px solid var(--color-hairline);
  color: var(--color-text);
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: var(--tracking-wide);
  padding: 0.5rem 0.75rem;
  border-radius: var(--radius-md);
  cursor: pointer;
}
.month-select:focus { outline: none; border-color: var(--color-accent); }

/* ----- Theme toggle ----- */
.theme-toggle {
  background: transparent;
  border: 1px solid var(--color-hairline);
  border-radius: 999px;
  padding: 0;
  width: 36px; height: 36px;
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer;
  color: var(--color-label);
  transition: color var(--duration-fast), border-color var(--duration-fast);
}
.theme-toggle:hover { color: var(--color-text); border-color: var(--color-text); }
.theme-toggle svg { width: 16px; height: 16px; }
[data-theme="dark"] .theme-toggle .sun  { display: block; }
[data-theme="dark"] .theme-toggle .moon { display: none;  }
:root:not([data-theme="dark"]) .theme-toggle .sun  { display: none;  }
:root:not([data-theme="dark"]) .theme-toggle .moon { display: block; }

/* ----- User chip ----- */
.user-chip {
  display: inline-flex; align-items: center; gap: var(--space-2);
  padding: 0.375rem 0.5rem 0.375rem 0.75rem;
  border-radius: 999px;
  background: var(--color-card);
  border: 1px solid var(--color-hairline);
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--color-label);
}
.user-chip__email { max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.user-chip__signout {
  background: transparent; border: none; cursor: pointer;
  color: var(--color-label); padding: 4px 6px; border-radius: var(--radius-sm);
  font: inherit;
}
.user-chip__signout:hover { color: var(--color-text); background: var(--color-base); }

/* ----- Grid layouts ----- */
.grid { display: grid; gap: var(--space-5); }
.grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 1024px) { .grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 768px)  { .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; } }

/* ----- Card padding ----- */
.dashboard-card {
  padding: var(--space-5);
  display: flex; flex-direction: column; gap: var(--space-3);
}

/* ----- KPI stat overrides ----- */
.kpi-value { font-size: clamp(1.5rem, 2.4vw, 2rem); }
.kpi-value--positive { color: var(--color-positive); }
.kpi-value--negative { color: var(--color-negative); }

/* ----- Chart wrap ----- */
.chart-wrap { position: relative; height: 280px; width: 100%; }
.chart-wrap--tall { height: 360px; }

/* ----- Budget bars ----- */
.budget-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 80px;
  gap: var(--space-3);
  align-items: center;
  padding: 0.5rem 0;
  font-size: 13px;
}
.budget-row__label { font-family: var(--font-sans); color: var(--color-body); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.budget-row__value { font-family: var(--font-mono); color: var(--color-text); text-align: right; font-variant-numeric: tabular-nums; }
.budget-row__bar {
  grid-column: 1 / -1;
  height: 6px;
  background: var(--color-hairline);
  border-radius: 999px;
  overflow: hidden;
  margin-top: 4px;
}
.budget-row__bar-fill { height: 100%; background: var(--color-accent); transition: width var(--duration-slow) var(--ease-out); }
.budget-row__bar-fill[data-over="true"] { background: var(--color-negative); }

/* ----- Founder + Loans cards ----- */
.founder-list, .loan-list, .revenue-list { display: flex; flex-direction: column; gap: var(--space-3); }
.founder-card, .loan-card, .revenue-card {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: var(--space-3);
  padding: var(--space-3) 0;
  border-top: 1px solid var(--color-hairline);
}
.founder-card:first-child, .loan-card:first-child, .revenue-card:first-child { border-top: none; padding-top: 0; }
.founder-card__name, .loan-card__name, .revenue-card__client {
  font-family: var(--font-sans); font-weight: 500; color: var(--color-text); font-size: 14px;
}
.founder-card__breakdown { font-family: var(--font-mono); font-size: 11px; color: var(--color-label); margin-top: 2px; }
.founder-card__total, .loan-card__amount, .revenue-card__amount {
  font-family: var(--font-mono); font-size: 14px; color: var(--color-text);
  font-variant-numeric: tabular-nums; text-align: right;
}
.loan-card__meta, .revenue-card__meta { font-family: var(--font-mono); font-size: 10px; color: var(--color-label); letter-spacing: var(--tracking-wide); text-transform: uppercase; margin-top: 4px; }

/* ----- Transaction list ----- */
.tx-section-header {
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--space-3); flex-wrap: wrap;
}
.tx-list { display: flex; flex-direction: column; }
.tx-row {
  display: grid;
  grid-template-columns: 100px minmax(0, 2.2fr) minmax(0, 1.4fr) 90px 110px;
  align-items: center;
  gap: var(--space-4);
  padding: var(--space-3) var(--space-2);
  border-top: 1px solid var(--color-hairline);
  cursor: pointer;
  background: transparent;
  border-left: none; border-right: none; border-bottom: none;
  text-align: left; width: 100%;
  font: inherit; color: inherit;
  transition: background var(--duration-fast);
}
.tx-row:first-child { border-top: none; }
.tx-row:hover { background: var(--color-card); }
.tx-row:focus-visible { outline: 2px solid var(--color-accent); outline-offset: -2px; }
.tx-row__date { font-family: var(--font-mono); font-size: 11px; color: var(--color-label); }
.tx-row__desc { font-family: var(--font-sans); font-size: 14px; color: var(--color-text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tx-row__cat { font-family: var(--font-mono); font-size: 10px; color: var(--color-label); letter-spacing: var(--tracking-wide); text-transform: uppercase; }
.tx-row__cat--uncat { color: var(--color-accent); }
.tx-row__account { font-family: var(--font-mono); font-size: 10px; color: var(--color-muted); letter-spacing: var(--tracking-wide); text-transform: uppercase; text-align: right; }
.tx-row__amount { font-family: var(--font-mono); font-size: 14px; font-variant-numeric: tabular-nums; text-align: right; }
.tx-row__amount[data-direction="IN"]  { color: var(--color-positive); }
.tx-row__amount[data-direction="OUT"] { color: var(--color-text); }
@media (max-width: 768px) {
  .tx-row {
    grid-template-columns: 1fr auto;
    grid-template-areas: "desc amount" "meta meta";
  }
  .tx-row__desc { grid-area: desc; }
  .tx-row__amount { grid-area: amount; }
  .tx-row__date, .tx-row__cat, .tx-row__account { grid-area: auto; font-size: 10px; }
}

/* ----- Categorize panel ----- */
.cat-panel-content { padding: var(--space-5); display: flex; flex-direction: column; gap: var(--space-4); overflow-y: auto; flex: 1; }
.cat-panel-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: var(--space-4) var(--space-5);
  border-bottom: 1px solid var(--color-hairline);
}
.cat-panel-header__close {
  background: transparent; border: none; cursor: pointer; padding: 6px 8px;
  color: var(--color-label); font: inherit; font-size: 18px; line-height: 1;
}
.cat-field { display: flex; flex-direction: column; gap: var(--space-2); }
.cat-field__label { font-family: var(--font-mono); font-size: 10px; letter-spacing: var(--tracking-widest); text-transform: uppercase; color: var(--color-label); }
.cat-tx-summary {
  padding: var(--space-4);
  background: var(--color-base);
  border: 1px solid var(--color-hairline);
  border-radius: var(--radius-md);
  font-family: var(--font-mono);
  font-size: 12px;
  display: flex; flex-direction: column; gap: 4px;
}
.cat-tx-summary__amount { font-size: 20px; color: var(--color-text); font-variant-numeric: tabular-nums; margin-bottom: 4px; }
.cat-tx-summary__amount[data-direction="IN"] { color: var(--color-positive); }
.cat-panel-footer {
  padding: var(--space-4) var(--space-5);
  border-top: 1px solid var(--color-hairline);
  display: flex; justify-content: flex-end; gap: var(--space-3);
}

/* ----- Cash card (mirrors VAT visual rhythm) ----- */
.cash-card { gap: var(--space-4); }

/* ----- Tax-exposure per-year breakdown ----- */
.tax-year-header,
.tax-year-row {
  display: grid;
  grid-template-columns: 60px 1fr 1fr;
  gap: var(--space-3);
  align-items: baseline;
  padding: 4px 0;
  font-family: var(--font-mono);
  font-size: 11px;
  font-variant-numeric: tabular-nums;
}
.tax-year-header {
  letter-spacing: var(--tracking-widest);
  text-transform: uppercase;
  color: var(--color-label);
  border-bottom: 1px solid var(--color-hairline);
  font-size: 10px;
  margin-bottom: 4px;
}
.tax-year-row__year   { color: var(--color-label); }
.tax-year-row__taken  { color: var(--color-text); text-align: right; }
.tax-year-row__tax    { color: var(--color-negative); text-align: right; }

.tax-founder-card {
  display: block;
}
.tax-card-header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--color-hairline);
  margin-bottom: 8px;
}
.tax-card-header__tax-label {
  font-family: var(--font-mono);
  font-size: 9px;
  letter-spacing: var(--tracking-widest);
  text-transform: uppercase;
  color: var(--color-label);
  margin-left: 4px;
}
.tax-card-body { padding-top: 4px; }
.tax-net-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 4px 0;
  font-family: var(--font-mono);
  font-size: 11px;
  font-variant-numeric: tabular-nums;
}
.tax-net-row__label { color: var(--color-body); }
.tax-net-row__amount { color: var(--color-text); }
.tax-net-row__amount[data-positive] { color: var(--color-positive); }
.tax-net-row--total {
  border-top: 1px solid var(--color-hairline);
  margin-top: 4px;
  padding-top: 8px;
  font-weight: 500;
}
.tax-net-row--total .tax-net-row__amount { color: var(--color-text); font-size: 13px; }
.tax-net-row--note {
  color: var(--color-label);
  font-size: 10px;
  font-style: italic;
  padding-top: 6px;
  display: block;
}

/* ----- VAT card ----- */
.vat-card { gap: var(--space-4); }
.vat-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-4);
}
@media (max-width: 640px) { .vat-grid { grid-template-columns: 1fr; } }
.vat-stat { display: flex; flex-direction: column; gap: var(--space-2); }
.vat-stat__value { font-size: clamp(1.4rem, 2.2vw, 1.85rem); }
.vat-stat--delta .vat-stat__value[data-state="short"]   { color: var(--color-negative); }
.vat-stat--delta .vat-stat__value[data-state="surplus"] { color: var(--color-positive); }
.vat-stat--delta .vat-stat__value[data-state="even"]    { color: var(--color-text); }
.chip[data-state="short"]   { color: var(--color-negative); border-color: var(--color-negative); }
.chip[data-state="surplus"] { color: var(--color-positive); border-color: var(--color-positive); }
.chip[data-state="even"]    { color: var(--color-accent);  border-color: var(--color-accent); }

/* ----- Account balances grid ----- */
.balances-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-3) var(--space-4);
}
@media (max-width: 480px) { .balances-grid { grid-template-columns: 1fr; } }
.balance-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: var(--space-2);
  padding: var(--space-3) 0;
  border-top: 1px solid var(--color-hairline);
  align-items: baseline;
}
.balance-row:nth-child(-n+2) { border-top: none; padding-top: 0; }
@media (max-width: 480px) {
  .balance-row:nth-child(1)  { border-top: none; padding-top: 0; }
  .balance-row:nth-child(2)  { border-top: 1px solid var(--color-hairline); padding-top: var(--space-3); }
}
.balance-row__name { font-family: var(--font-sans); font-weight: 500; color: var(--color-text); font-size: 14px; }
.balance-row__meta { font-family: var(--font-mono); font-size: 10px; color: var(--color-label); letter-spacing: var(--tracking-wide); text-transform: uppercase; margin-top: 2px; }
.balance-row__amount { font-family: var(--font-mono); font-size: 14px; color: var(--color-text); font-variant-numeric: tabular-nums; text-align: right; }
.balance-row__amount[data-zero="true"] { color: var(--color-muted); }

/* ============================================================
   TAB NAV + PAGE ARCHITECTURE
   ============================================================ */
.tab-nav {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  border-bottom: 1px solid var(--color-hairline);
  margin-bottom: var(--space-6);
  flex-wrap: wrap;
  padding-bottom: 0;
}
.tab-nav__link {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: var(--tracking-widest);
  text-transform: uppercase;
  color: var(--color-label);
  text-decoration: none;
  padding: var(--space-3) var(--space-2);
  margin-bottom: -1px;
  border-bottom: 2px solid transparent;
  transition: color var(--duration-fast), border-color var(--duration-fast);
}
.tab-nav__link:hover { color: var(--color-text); }
.tab-nav__link[aria-current="page"] {
  color: var(--color-accent);
  border-bottom-color: var(--color-accent);
}
.tab-nav__range-summary {
  margin-left: auto;
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--color-muted);
  letter-spacing: var(--tracking-wide);
}

.page { display: block; }
.page[hidden] { display: none !important; }

/* ============================================================
   OVERVIEW PAGE — KPI strip
   ============================================================ */
.kpi-strip {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: var(--space-4);
  padding: var(--space-4) var(--space-5);
  border: 1px solid var(--color-hairline);
  border-radius: var(--radius-lg);
  background: var(--color-card);
  margin-bottom: var(--space-6);
}
@media (max-width: 768px) { .kpi-strip { grid-template-columns: repeat(2, 1fr); } }
.kpi-strip > div { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.kpi-strip__label {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: var(--tracking-widest);
  text-transform: uppercase;
  color: var(--color-label);
}
.kpi-strip__value {
  font-family: var(--font-mono);
  font-size: 16px;
  font-variant-numeric: tabular-nums;
  color: var(--color-text);
  font-weight: 500;
}
.kpi-strip__value[data-positive="true"] { color: var(--color-positive); }
.kpi-strip__value[data-negative="true"] { color: var(--color-negative); }

/* ============================================================
   TRANSACTIONS PAGE
   ============================================================ */
.tx-filter-bar {
  display: flex;
  gap: var(--space-3);
  align-items: center;
  flex-wrap: wrap;
  padding-bottom: var(--space-3);
  border-bottom: 1px solid var(--color-hairline);
  margin-bottom: var(--space-3);
}
.tx-filter-search { flex: 1 1 280px; min-width: 200px; }
.tx-filter-toggle {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--color-body);
  cursor: pointer;
}

.tx-table-wrap { overflow-x: auto; }
.tx-table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--font-sans);
  font-size: 13px;
}
.tx-table th {
  text-align: left;
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: var(--tracking-widest);
  text-transform: uppercase;
  color: var(--color-label);
  font-weight: 500;
  padding: var(--space-3) var(--space-2);
  border-bottom: 1px solid var(--color-hairline);
  position: sticky;
  top: 0;
  background: var(--color-card);
  z-index: 1;
}
.tx-table td {
  padding: var(--space-3) var(--space-2);
  border-bottom: 1px solid var(--color-hairline);
  vertical-align: middle;
}
.tx-table tr:hover td { background: var(--color-base); }
.tx-table__check { width: 32px; }
.tx-table__check input { cursor: pointer; }
.tx-table__amount { text-align: right; }
.tx-table__date  { font-family: var(--font-mono); color: var(--color-label); font-size: 11px; white-space: nowrap; }
.tx-table__desc { color: var(--color-text); max-width: 360px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; }
.tx-table__desc:hover { text-decoration: underline; }
.tx-table__cat   { font-family: var(--font-mono); font-size: 11px; color: var(--color-label); }
.tx-table__cat--uncat { color: var(--color-accent); }
.tx-table__client { font-family: var(--font-sans); font-size: 12px; color: var(--color-body); }
.tx-table__account { font-family: var(--font-mono); font-size: 10px; color: var(--color-muted); letter-spacing: var(--tracking-wide); text-transform: uppercase; }
.tx-table__amt-cell { font-family: var(--font-mono); font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; }
.tx-table__amt-cell[data-direction="IN"]  { color: var(--color-positive); }
.tx-table__amt-cell[data-direction="OUT"] { color: var(--color-text); }
.tx-table tr.tx-row--selected td { background: var(--color-accent-soft); }

/* ============================================================
   STICKY BULK BAR
   ============================================================ */
.bulk-bar {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background: var(--color-card);
  border-top: 2px solid var(--color-accent);
  box-shadow: 0 -8px 24px -8px rgba(0,0,0,0.40);
  padding: var(--space-3) var(--space-5);
  display: flex;
  align-items: center;
  gap: var(--space-3);
  z-index: var(--z-toast);
  flex-wrap: wrap;
}
.bulk-bar__count {
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--color-accent);
  font-weight: 500;
  padding-right: var(--space-2);
  border-right: 1px solid var(--color-hairline);
}
.bulk-bar__field { max-width: 240px; }

/* ============================================================
   REPORTS PAGE
   ============================================================ */
.best-worst-list { display: flex; flex-direction: column; gap: var(--space-2); }
.best-worst-row {
  display: grid;
  grid-template-columns: 90px 1fr auto;
  align-items: baseline;
  gap: var(--space-3);
  padding: var(--space-2) 0;
  border-top: 1px solid var(--color-hairline);
  font-size: 13px;
}
.best-worst-row:first-child { border-top: none; }
.best-worst-row__rank {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: var(--tracking-widest);
  text-transform: uppercase;
  color: var(--color-label);
}
.best-worst-row__month { font-family: var(--font-sans); color: var(--color-text); }
.best-worst-row__amount {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  text-align: right;
  font-size: 14px;
}
.best-worst-row__amount[data-positive="true"] { color: var(--color-positive); }
.best-worst-row__amount[data-negative="true"] { color: var(--color-negative); }

.ranked-list { display: flex; flex-direction: column; }
.ranked-list-row {
  display: grid;
  grid-template-columns: 1fr 90px 110px;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3) 0;
  border-top: 1px solid var(--color-hairline);
  font-size: 13px;
}
.ranked-list-row:first-child { border-top: none; }
.ranked-list-row__name { color: var(--color-text); }
.ranked-list-row__count { font-family: var(--font-mono); font-size: 11px; color: var(--color-label); text-align: right; }
.ranked-list-row__amount { font-family: var(--font-mono); font-variant-numeric: tabular-nums; text-align: right; color: var(--color-text); font-size: 14px; }
.ranked-list-row__bar {
  grid-column: 1 / -1;
  height: 4px;
  background: var(--color-hairline);
  border-radius: 999px;
  overflow: hidden;
  margin-top: 4px;
}
.ranked-list-row__bar-fill {
  height: 100%;
  background: var(--color-accent);
  border-radius: 999px;
  transition: width var(--duration-slow) var(--ease-out);
}

#yoy-table {
  display: grid;
  grid-template-columns: 1fr repeat(2, 130px);
  gap: 0;
  font-family: var(--font-mono);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}
#yoy-table .yoy-header,
#yoy-table .yoy-cell {
  padding: var(--space-3) var(--space-3);
  border-bottom: 1px solid var(--color-hairline);
}
#yoy-table .yoy-header {
  font-size: 10px;
  letter-spacing: var(--tracking-widest);
  text-transform: uppercase;
  color: var(--color-label);
}
#yoy-table .yoy-cell--num { text-align: right; color: var(--color-text); }

/* ----- Loading + login ----- */
.loading-screen {
  min-height: 60dvh;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--space-4);
}
.loading-text { font-family: var(--font-mono); font-size: 11px; letter-spacing: var(--tracking-widest); text-transform: uppercase; color: var(--color-label); }

.login-card {
  max-width: 420px;
  margin: 12dvh auto 0;
  padding: var(--space-6);
  display: flex; flex-direction: column; gap: var(--space-4);
}
.login-card h2 {
  font-family: var(--font-display); font-size: 1.5rem; font-weight: 500;
  letter-spacing: var(--tracking-tight); color: var(--color-text); margin: 0;
}
.login-card h2 em { font-family: var(--font-serif); font-style: italic; font-weight: 400; }
.login-card p { font-family: var(--font-sans); font-size: 14px; color: var(--color-body); line-height: 1.5; }
.login-status { font-family: var(--font-mono); font-size: 11px; letter-spacing: var(--tracking-wide); }
.login-status--ok { color: var(--color-positive); }
.login-status--err { color: var(--color-negative); }

/* ============================================================
   Advisor / decision additions (runway, tax reserve gap, aging)
   ============================================================ */

/* Runway chip — extend existing states with "critical" */
.chip[data-state="critical"] {
  color: #fff;
  background: var(--color-negative);
  border-color: var(--color-negative);
}

/* Cash advisor recommendation note */
.advisor-note {
  margin-top: var(--space-4);
  padding: var(--space-3) var(--space-4);
  font-family: var(--font-sans);
  font-size: 13px;
  line-height: 1.55;
  color: var(--color-body);
  border-left: 2px solid var(--color-label);
  background: var(--color-base);
}
.advisor-note[data-state="critical"] { border-left-color: var(--color-negative); color: var(--color-text); background: color-mix(in srgb, var(--color-negative) 8%, var(--color-base)); }
.advisor-note[data-state="short"]    { border-left-color: var(--color-negative); }
.advisor-note[data-state="even"]     { border-left-color: var(--color-accent); }
.advisor-note[data-state="surplus"]  { border-left-color: var(--color-positive); }

/* Tax reserve gap rows */
.reserve-gap {
  margin-top: var(--space-4);
  padding-top: var(--space-3);
  border-top: 1px dashed var(--color-line);
  display: flex; flex-direction: column; gap: var(--space-2);
}
.reserve-gap__row {
  display: flex; justify-content: space-between; align-items: baseline;
  font-family: var(--font-mono); font-size: 12px;
  color: var(--color-body);
}
.reserve-gap__label { color: var(--color-label); }
.reserve-gap__value { color: var(--color-text); font-variant-numeric: tabular-nums; }
.reserve-gap__row--total {
  padding-top: var(--space-2); margin-top: var(--space-1);
  border-top: 1px solid var(--color-line);
  font-size: 13px;
}
.reserve-gap__row--total .reserve-gap__label { color: var(--color-text); font-weight: 500; }
.reserve-gap__row--total .reserve-gap__value { font-size: 15px; font-weight: 500; }
.reserve-gap__value[data-state="short"]   { color: var(--color-negative); }
.reserve-gap__value[data-state="surplus"] { color: var(--color-positive); }

/* Uncategorized aging widget */
.aging-card .eyebrow span:first-child { color: var(--color-text); }
.aging-list {
  display: flex; flex-direction: column;
  margin-top: var(--space-3);
}
.aging-row {
  display: flex; justify-content: space-between; align-items: center;
  padding: var(--space-3) 0;
  border-top: 1px solid var(--color-line);
  cursor: pointer;
  transition: background var(--duration-fast);
}
.aging-row:hover { background: var(--color-base); }
.aging-row:first-child { border-top: none; }
.aging-row__left { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; padding-right: var(--space-3); }
.aging-row__desc {
  font-family: var(--font-sans); font-size: 13px; color: var(--color-text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.aging-row__meta {
  font-family: var(--font-mono); font-size: 11px; color: var(--color-label);
  letter-spacing: var(--tracking-wide);
}
.aging-row__age { color: var(--color-negative); }
.aging-row__amount {
  font-family: var(--font-mono); font-size: 13px;
  color: var(--color-negative);
  white-space: nowrap;
}

/* ============================================================
   Invoices module (Expected Income card + Invoices page)
   ============================================================ */

.expected-grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: var(--space-4); margin-top: var(--space-3);
}
.expected-stat {
  display: flex; flex-direction: column; gap: var(--space-2);
  padding: var(--space-3); border: 1px solid var(--color-line);
  background: var(--color-base);
}
.expected-stat__value { font-size: clamp(1.3rem, 2vw, 1.7rem); }
.expected-stat--overdue .expected-stat__value[data-state="short"] { color: var(--color-negative); }
.expected-stat--overdue .expected-stat__value[data-state="surplus"] { color: var(--color-positive); }

@media (max-width: 720px) {
  .expected-grid { grid-template-columns: 1fr; }
}

/* Invoice upload form */
.inv-form {
  display: grid; grid-template-columns: 160px 1fr;
  gap: var(--space-2) var(--space-3); margin-top: var(--space-3); align-items: center;
}
.inv-form__label { margin: 0; text-align: right; }
.inv-form__actions {
  grid-column: 2 / -1; display: flex; align-items: center; gap: var(--space-3); margin-top: var(--space-3);
}
@media (max-width: 600px) {
  .inv-form { grid-template-columns: 1fr; }
  .inv-form__label { text-align: left; }
  .inv-form__actions { grid-column: 1 / -1; }
}

.inv-filter-row { display: flex; gap: var(--space-2); align-items: center; }

/* Invoice table — use existing tx-table base, add badges */
.inv-table th, .inv-table td { padding: var(--space-2) var(--space-3); }
.inv-row--overdue { background: color-mix(in srgb, var(--color-negative) 6%, transparent); }
.inv-row--due-soon { background: color-mix(in srgb, var(--color-accent) 5%, transparent); }
.inv-row--paid { color: var(--color-label); }
.inv-row--paid .tx-table__amount { color: var(--color-label); }

.inv-status {
  display: inline-block; padding: 2px 8px; border-radius: 999px;
  font-family: var(--font-mono); font-size: 10px;
  letter-spacing: var(--tracking-wide); text-transform: uppercase;
  border: 1px solid var(--color-line); color: var(--color-label);
}
.inv-status--overdue   { color: var(--color-negative); border-color: var(--color-negative); }
.inv-status--due-soon  { color: var(--color-accent);   border-color: var(--color-accent); }
.inv-status--pending   { color: var(--color-text);     border-color: var(--color-text); }
.inv-status--paid      { color: var(--color-positive); border-color: var(--color-positive); }
.inv-status--cancelled { color: var(--color-label);    border-color: var(--color-line); }

.inv-match-badge {
  display: inline-block; width: 8px; height: 8px; border-radius: 50%;
  background: var(--color-positive); margin-left: var(--space-2);
}

.inv-due-rel { color: var(--color-label); font-size: 11px; }

.btn--small {
  padding: 4px 10px; font-size: 11px; letter-spacing: var(--tracking-wide);
}

/* ============================================================
   Revenue Concentration
   ============================================================ */
.conc-bar {
  display: flex; height: 20px; margin-top: var(--space-3);
  border: 1px solid var(--color-line); overflow: hidden;
}
.conc-bar__seg { transition: opacity var(--duration-fast); cursor: default; }
.conc-bar__seg:hover { opacity: 0.85; }

.conc-legend { display: flex; flex-direction: column; margin-top: var(--space-3); gap: 2px; }
.conc-legend__row {
  display: grid; grid-template-columns: 12px 1fr auto auto;
  gap: var(--space-3); align-items: center;
  padding: var(--space-2) 0; border-top: 1px solid var(--color-line);
  font-family: var(--font-mono); font-size: 12px;
}
.conc-legend__row:first-child { border-top: none; }
.conc-legend__dot { width: 10px; height: 10px; border-radius: 2px; }
.conc-legend__name { color: var(--color-text); }
.conc-legend__amt { color: var(--color-body); font-variant-numeric: tabular-nums; }
.conc-legend__pct { color: var(--color-label); min-width: 50px; text-align: right; font-variant-numeric: tabular-nums; }

/* ============================================================
   Forward 90-day Cash Forecast
   ============================================================ */
.forecast-breakdown {
  display: flex; flex-direction: column;
  margin-top: var(--space-3); gap: 2px;
}
.forecast-row {
  display: flex; justify-content: space-between;
  padding: var(--space-2) 0;
  font-family: var(--font-mono); font-size: 12px;
  color: var(--color-body);
}
.forecast-row--total {
  margin-top: var(--space-2); padding-top: var(--space-3);
  border-top: 1px solid var(--color-line);
  color: var(--color-text); font-weight: 500; font-size: 13px;
}
.forecast-note { margin-top: var(--space-3); font-size: 10px; line-height: 1.5; }

/* ===== Money-now snapshot (overview landing) ===== */
.snap {
  border: 1px solid var(--color-hairline);
  border-radius: 16px;
  background: var(--color-card);
  padding: 20px 22px;
  margin-bottom: var(--space-5, 20px);
}
.snap__head { display: flex; align-items: baseline; gap: 12px; margin-bottom: 16px; }
.snap__title { font-size: 0.78rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--color-label); }
.snap__period { font-size: 0.82rem; color: var(--color-label); margin-left: auto; }
.snap__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 14px;
}
.snap__tile {
  padding: 4px 2px;
  border-left: 2px solid var(--color-hairline);
  padding-left: 14px;
}
.snap__tile--cash { border-left-color: var(--color-accent); }
.snap__tile--tva  { border-left-color: var(--color-negative); }
.snap__tile--inv  { border-left-color: var(--color-positive); }
.snap__label { font-size: 0.72rem; letter-spacing: 0.05em; text-transform: uppercase; color: var(--color-label); margin-bottom: 6px; }
.snap__value { font-size: clamp(1.5rem, 2.6vw, 2rem); font-weight: 600; color: var(--color-text); line-height: 1.1; }
.snap__value[data-state="neg"] { color: var(--color-negative); }
.snap__value[data-state="pos"] { color: var(--color-positive); }
.snap__sub { font-size: 0.78rem; color: var(--color-label); margin-top: 4px; }

.ov-details { margin-top: 8px; }
.ov-details__summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  border: 1px solid var(--color-hairline);
  border-radius: 12px;
  background: var(--color-card);
  color: var(--color-label);
  font-size: 0.85rem;
  letter-spacing: 0.03em;
  user-select: none;
}
.ov-details__summary::-webkit-details-marker { display: none; }
.ov-details__summary::before { content: "▸"; font-size: 0.7rem; transition: transform 0.15s; }
.ov-details[open] .ov-details__summary::before { transform: rotate(90deg); }
.ov-details[open] .ov-details__summary { margin-bottom: var(--space-5, 20px); }
.ov-details__hint { margin-left: auto; font-size: 0.75rem; opacity: 0.7; }
