:root {
  --wb-bg: #f2f6f6;
  --wb-panel: #ffffff;
  --wb-panel-soft: #f7fafa;
  --wb-ink: #102a2a;
  --wb-muted: #60726f;
  --wb-subtle: #8fa39f;
  --wb-line: #dce7e4;
  --wb-line-strong: #c7d6d2;
  --wb-accent: #0f766e;
  --wb-accent-soft: #d9f3ee;
  --wb-good: #0a7a4a;
  --wb-good-soft: #e9f8f0;
  --wb-warn: #a15c07;
  --wb-warn-soft: #fff7e8;
  --wb-danger: #b42318;
  --wb-danger-soft: #fef3f2;
  --wb-side-bg: #0c1f1e;
  --wb-side-ink: #ffffff;
  --wb-side-muted: #94aaa6;
}
body { background-image: radial-gradient(1100px 500px at 90% -10%, rgba(15,118,110,.1), transparent 60%); }
.lf-view { display: block; }
.lf-view[hidden] { display: none !important; }
.lf-nav-count { min-width: 18px; margin-left: auto; padding: 1px 5px; border-radius: 999px; background: rgba(255,255,255,.12); color: #fff; font-size: 9px; text-align: center; }
.lf-chart-host { min-height: 226px; display: flex; align-items: flex-end; }
.lf-chart-host svg { width: 100%; height: auto; }
.lf-recent { margin-top: 14px; }
.lf-recon-summary { display: flex; justify-content: space-between; gap: 14px; margin-bottom: 12px; }
.lf-recon-summary div { display: grid; gap: 2px; }
.lf-recon-summary strong { font-family: var(--wb-font-display); font-size: 28px; letter-spacing: -0.05em; line-height: 1; }
.lf-recon-summary span { color: var(--wb-muted); font-size: 10px; }
.lf-full-button { width: 100%; margin-top: 10px; }
.lf-view .wb-table { margin: -2px 0; }
.lf-tx-empty { padding: 22px; }
.lf-select-all { white-space: nowrap; font-size: 11px; color: var(--wb-muted); }
.lf-recon-item { display: grid !important; grid-template-columns: 20px minmax(0, 1fr) auto; align-items: center !important; gap: 10px !important; padding: 11px 0 !important; }
.lf-recon-item .lf-recon-main { display: grid; gap: 2px; }
.lf-recon-item .lf-recon-main strong { font-size: 12px; }
.lf-recon-item .lf-recon-main small { color: var(--wb-muted); font-size: 10px; }
.lf-recon-item .lf-recon-amount { text-align: right; font-variant-numeric: tabular-nums; font-weight: 650; white-space: nowrap; }
.lf-recon-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--wb-line); }
.lf-recon-side .wb-panel-title { font-size: 21px; margin-bottom: 8px; }
.lf-steps { margin: 18px 0; padding: 0; list-style: none; display: grid; gap: 15px; }
.lf-steps li { display: grid; grid-template-columns: 22px 1fr; gap: 9px; }
.lf-steps li > span { color: var(--wb-accent); font-size: 10px; font-weight: 700; letter-spacing: .08em; padding-top: 2px; }
.lf-steps strong { display: block; font-size: 12px; }
.lf-steps p { margin-top: 2px; color: var(--wb-muted); font-size: 11px; line-height: 1.5; }
.lf-mini-stat { display: flex; justify-content: space-between; gap: 10px; padding-top: 13px; border-top: 1px solid var(--wb-line); color: var(--wb-muted); font-size: 10px; }
.lf-mini-stat strong { color: var(--wb-ink); font-weight: 600; }
.lf-drawer-actions { display: grid; gap: 8px; margin-top: 22px; }
.lf-form-note { margin: 14px 0 0; color: var(--wb-muted); font-size: 11px; line-height: 1.5; }
.lf-demo-note { margin-top: 22px; color: var(--wb-muted); font-size: 11px; }
.lf-demo-note a { color: var(--wb-accent); text-decoration: none; font-weight: 600; }
.lf-empty-cell { padding: 22px 12px !important; text-align: center; color: var(--wb-muted); }
@media (max-width: 860px) {
  .lf-recent { margin-top: 12px; }
}
@media (max-width: 560px) {
  .lf-recon-item { grid-template-columns: 20px minmax(0, 1fr); }
  .lf-recon-item .lf-recon-amount { grid-column: 2; text-align: left; }
  .lf-chart-host { min-height: 190px; }
  .wb-panel-tools { width: 100%; }
  .wb-panel-tools .wb-search { flex: 1 1 100%; }
  .lf-recon-summary strong { font-size: 23px; }
}
