/* ============================================================================
   BUDGETGRID — workspace · EXECUTE plane  (.ex-*)  tokens only
   ==========================================================================*/

/* ---- shared bits */
.portal-app .ex-link { border: none; background: transparent; padding: 0; font: inherit; font-weight: 600; color: var(--ink); cursor: pointer; text-align: left; text-decoration: underline; text-decoration-color: var(--line-2); text-underline-offset: 3px; }
.portal-app .ex-link:hover { color: var(--grid-ink); text-decoration-color: var(--grid); }
.portal-app .btn.ex-soft-teal { background: var(--teal-wash); color: var(--teal-ink); border-color: transparent; }
.portal-app .ex-desc { font-weight: 600; }
.portal-app .ex-due-over { color: var(--brick-ink); font-weight: 700; }

/* ---- pipeline strip */
.portal-app .ex-pipe { display: flex; align-items: center; gap: 6px; padding: 10px 12px; overflow-x: auto; scrollbar-width: none; }
.portal-app .ex-pipe::-webkit-scrollbar { display: none; }
.portal-app .ex-pipe > .ic { flex: none; color: var(--ink-4); width: 16px; height: 16px; }
.portal-app .ex-stage { flex: 1 0 auto; display: flex; align-items: center; gap: 10px; padding: 8px 12px; border-radius: var(--r-2); border: 1px solid transparent; background: transparent; color: var(--ink-2); font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; transition: background var(--t-fast), border-color var(--t-fast), transform var(--t-fast); }
.portal-app .ex-stage:hover { background: var(--neutral-wash); border-color: var(--line); transform: translateY(-1px); }
.portal-app .ex-stage-n { font-family: var(--font-display); font-size: 22px; font-weight: 600; line-height: 1; color: var(--ink-4); min-width: 28px; font-variant-numeric: tabular-nums; }
.portal-app .ex-stage-n.is-grid { color: var(--grid-ink); } .portal-app .ex-stage-n.is-cobalt { color: var(--cobalt-ink); } .portal-app .ex-stage-n.is-amber { color: var(--amber-ink); } .portal-app .ex-stage-n.is-brick { color: var(--brick-ink); } .portal-app .ex-stage-n.is-neutral { color: var(--ink); }

/* ---- ready table */
.portal-app .ex-ck-col { width: 36px; text-align: center; }
.portal-app .ex-ck { width: 18px; height: 18px; accent-color: var(--grid); cursor: pointer; margin: 0; vertical-align: middle; }
.portal-app .ex-ready-t tbody tr.is-sel td { background: var(--grid-wash); }
.portal-app .ex-ready-t tbody tr.is-overdue td:first-child { box-shadow: inset 3px 0 0 var(--brick); }
.portal-app .ex-ready-t td { vertical-align: top; }
.portal-app .ex-bulk-n { font-variant-numeric: tabular-nums; }

/* ---- in flight / queued / failed lists */
.portal-app .ex-flight { align-items: flex-start; }
.portal-app .ex-flight .li-end { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
.portal-app .ex-flight-acts { justify-content: flex-end; gap: 6px; }
.portal-app .ex-spin .ic { animation: ex-spin 1s linear infinite; }
@keyframes ex-spin { to { transform: rotate(360deg); } }
.portal-app .ex-queued { border-color: var(--amber); box-shadow: 0 0 0 3px var(--amber-wash), var(--shadow-1); }

/* ---- payroll */
.portal-app .ex-pay-grid { align-items: start; }
.portal-app .ex-pay { display: flex; flex-direction: column; gap: 12px; }
.portal-app .ex-pay-k { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.portal-app .ex-pay-k small, .portal-app .ex-rail-k small, .portal-app .ex-acct-k small { display: block; font-size: 11.5px; text-transform: uppercase; letter-spacing: .05em; color: var(--ink-3); font-weight: 700; }
.portal-app .ex-pay-k b { font-size: 18px; font-family: var(--font-display); }
.portal-app .ex-pay-line { display: flex; flex-direction: column; gap: 6px; }
.portal-app .ex-pay-meta { line-height: 1.6; }
.portal-app .ex-pay-acts { gap: 8px; }

/* ---- collections */
.portal-app .ex-col-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 18px; align-items: start; }
.portal-app .ex-col { align-items: flex-start; }
.portal-app .ex-col .li-t { white-space: normal; }
.portal-app .ex-col .li-end { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
.portal-app .ex-col-url { display: flex; align-items: center; gap: 6px; margin-top: 6px; }
.portal-app .ex-col-url code { font-size: 12px; padding: 4px 8px; border-radius: var(--r-1); background: var(--bg-2); color: var(--ink-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
.portal-app .ex-col-url .icon-btn { width: 30px; height: 30px; }

/* ---- rails */
.portal-app .ex-rails { align-items: stretch; }
.portal-app .ex-rail { display: flex; flex-direction: column; gap: 12px; border-top: 4px solid var(--line-2); }
.portal-app .ex-rail-paystack { border-top-color: var(--teal); } .portal-app .ex-rail-flutterwave { border-top-color: var(--amber); } .portal-app .ex-rail-moniepoint { border-top-color: var(--cobalt); } .portal-app .ex-rail-bank { border-top-color: var(--grid); }
.portal-app .ex-rail .card-head h3 { font-size: 16px; }
.portal-app .ex-rail-k { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.portal-app .ex-rail-k b { font-size: 14px; }
.portal-app .ex-rail-share { display: flex; flex-direction: column; gap: 6px; margin-top: auto; }
.portal-app .ex-rail .meter i.meter-teal { background: var(--teal); } .portal-app .ex-rail .meter i.meter-amber { background: var(--amber); } .portal-app .ex-rail .meter i.meter-cobalt { background: var(--cobalt); } .portal-app .ex-rail .meter i.meter-grid { background: var(--grid); }
.portal-app .ex-custody { display: flex; gap: 18px; align-items: flex-start; background: linear-gradient(135deg, var(--teal-wash), transparent 60%), var(--card); }
.portal-app .ex-custody h3 { margin: 0 0 6px; font-size: 22px; }
.portal-app .ex-custody-ic { flex: none; width: 52px; height: 52px; border-radius: var(--r-2); display: grid; place-items: center; background: var(--teal); color: var(--on-fill); }
.portal-app .ex-custody-ic .ic { width: 28px; height: 28px; }
.portal-app .ex-custody-p { margin: 0 0 12px; font-size: 14.5px; line-height: 1.6; max-width: 78ch; }
.portal-app .ex-switch-l { gap: 10px; cursor: pointer; }
.portal-app .ex-drill-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 12px; }
.portal-app .ex-drill-i { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: var(--r-2); background: var(--neutral-wash); font-size: 13.5px; }
.portal-app .ex-drill-i > .ic { flex: none; width: 20px; height: 20px; margin-top: 2px; color: var(--ink-3); }
.portal-app .ex-drill-i.is-ok { background: var(--grid-wash); } .portal-app .ex-drill-i.is-ok > .ic { color: var(--grid-ink); }
.portal-app .ex-drill-i.is-warn { background: var(--amber-wash); } .portal-app .ex-drill-i.is-warn > .ic { color: var(--amber-ink); }

/* ---- accounts */
.portal-app .ex-ent { display: flex; flex-direction: column; gap: 12px; }
.portal-app .ex-ent-h { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.portal-app .ex-ent-h h3 { margin: 0; } .portal-app .ex-ent-h .money { font-size: 20px; }
.portal-app .ex-acct-grid { align-items: start; }
.portal-app .ex-acct { display: flex; flex-direction: column; gap: 8px; }
.portal-app .ex-acct-bank { display: flex; align-items: center; gap: 10px; }
.portal-app .ex-acct-ic { width: 36px; height: 36px; border-radius: var(--r-1); display: grid; place-items: center; background: var(--bg-2); color: var(--ink-2); flex: none; }
.portal-app .ex-acct-bal { font-size: 28px; line-height: 1.1; }
.portal-app .ex-acct-k { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; font-size: 13px; }
.portal-app .ex-acct-d summary { cursor: pointer; font-size: 13px; font-weight: 600; color: var(--ink-2); padding: 6px 0; list-style: none; display: flex; align-items: center; gap: 6px; }
.portal-app .ex-acct-d summary::-webkit-details-marker { display: none; }
.portal-app .ex-acct-d summary::before { content: ''; width: 0; height: 0; border-left: 5px solid var(--ink-3); border-top: 4px solid transparent; border-bottom: 4px solid transparent; transition: transform var(--t-fast); }
.portal-app .ex-acct-d[open] summary::before { transform: rotate(90deg); }
.portal-app .ex-acct-d .table-wrap { margin-top: 6px; max-height: 280px; overflow: auto; }
.portal-app .ex-total td { background: var(--card-2); border-top: 2px solid var(--line-2); }

/* ---- responsive */
@media (max-width: 1100px) { .portal-app .ex-drill-grid { grid-template-columns: 1fr; } .portal-app .ex-col-grid { grid-template-columns: 1fr; } }
@media (max-width: 700px) {
  .portal-app .ex-pipe { gap: 2px; } .portal-app .ex-stage { padding: 6px 8px; font-size: 12px; gap: 6px; } .portal-app .ex-stage-n { font-size: 18px; min-width: 22px; }
  .portal-app .ex-pay-k { grid-template-columns: 1fr 1fr; } .portal-app .ex-custody { flex-direction: column; }
  .portal-app .ex-flight, .portal-app .ex-col { flex-direction: column; align-items: stretch; } .portal-app .ex-flight .li-end, .portal-app .ex-col .li-end { align-items: flex-start; } .portal-app .ex-flight-acts { justify-content: flex-start; }
  .portal-app .ex-acct-bal { font-size: 24px; }
}