.stats-flow-deck { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 16px; }
.stat-pill-card { background-color: var(--sys-surface-lowest); border-radius: var(--radius-lg); padding: 18px 22px; transition: transform var(--trans-fast); }
.stat-pill-card:hover { transform: translateY(-2px); }
.stat-meta { font-size: 12px; color: var(--sys-text-muted); margin-bottom: 6px; }
.stat-numeric { font-size: 26px; font-weight: 600; color: var(--sys-text); }
.numeric-green { color: var(--sys-success); }
.numeric-red { color: var(--sys-danger); }
.numeric-ver { color: var(--sys-primary); font-family: var(--font-mono); font-size: 17px; }

.filter-action-island { display: flex; justify-content: space-between; align-items: center; background-color: var(--sys-surface-lowest); border-radius: var(--radius-pill); padding: 8px 16px; margin-bottom: 16px; }
.search-capsule { display: flex; align-items: center; gap: 10px; background-color: var(--sys-surface-low); padding: 6px 16px; border-radius: var(--radius-pill); width: 360px; }
.search-capsule input { background: transparent; color: inherit; width: 100%; font-family: inherit; font-size: 13px; }
.filter-chips-cluster { display: flex; gap: 8px; }
.filter-capsule { background-color: var(--sys-surface-low); color: var(--sys-text-muted); padding: 6px 16px; border-radius: var(--radius-pill); font-size: 12px; cursor: pointer; transition: all var(--trans-fast); }
.filter-capsule.active { background-color: var(--sys-surface-highest); color: var(--sys-primary); }

.panels-data-container { background-color: var(--sys-surface-lowest); border-radius: var(--radius-xl); padding: 8px; }
.m3-organic-table { width: 100%; border-collapse: separate; border-spacing: 0 6px; }
.m3-organic-table th { padding: 12px 18px; color: var(--sys-text-subtle); font-size: 12px; font-weight: 500; text-align: left; }
.m3-organic-table td { padding: 14px 18px; background-color: var(--sys-surface-low); vertical-align: middle; font-size: 13px; }
.m3-organic-table tr td:first-child { border-radius: var(--radius-md) 0 0 var(--radius-md); }
.m3-organic-table tr td:last-child { border-radius: 0 var(--radius-md) var(--radius-md) 0; }
.m3-organic-table tr:hover td { background-color: var(--sys-surface); }

.status-capsule { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: var(--radius-pill); font-size: 12px; font-weight: 500; }
.status-capsule.online { background-color: var(--sys-success-bg); color: var(--sys-success); }
.status-capsule.banned { background-color: var(--sys-danger-bg); color: var(--sys-danger); }
.status-capsule.offline { background-color: var(--sys-surface-high); color: var(--sys-text-muted); }

.key-pill { font-family: var(--font-mono); font-size: 12px; background-color: var(--sys-surface-high); color: var(--sys-secondary); padding: 4px 8px; border-radius: var(--radius-xs); cursor: pointer; }
.key-pill:hover { background-color: var(--sys-surface-hover); }

.agent-badge-pill { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: var(--radius-pill); font-size: 11px; font-weight: 500; }
.agent-badge-pill.active { background-color: var(--sys-primary-container); color: var(--sys-on-primary-container); }
.agent-badge-pill.disabled { background-color: var(--sys-surface-high); color: var(--sys-text-subtle); }

.tokens-mini-bar { display: flex; flex-direction: column; gap: 4px; min-width: 140px; }
.tokens-labels { display: flex; justify-content: space-between; font-size: 11px; font-family: var(--font-mono); }
.tokens-track { height: 6px; background-color: var(--sys-surface-high); border-radius: var(--radius-pill); overflow: hidden; }
.tokens-fill { height: 100%; background-color: var(--sys-primary); border-radius: var(--radius-pill); transition: width var(--trans-normal); }

.tx-chip { display: inline-flex; align-items: center; padding: 3px 10px; border-radius: var(--radius-pill); font-size: 11px; font-weight: 500; }
.tx-chip.topup { background-color: var(--sys-success-bg); color: var(--sys-success); }
.tx-chip.grant { background-color: #381e72; color: var(--sys-tertiary); }
.tx-chip.consumption { background-color: var(--sys-surface-high); color: var(--sys-text-muted); }

.history-list-box { display: flex; flex-direction: column; gap: 8px; max-height: 280px; overflow-y: auto; padding-right: 4px; }
.history-item-row { display: flex; justify-content: space-between; align-items: center; background-color: var(--sys-surface); padding: 10px 14px; border-radius: var(--radius-md); }
.history-meta { display: flex; flex-direction: column; gap: 2px; }
.history-date { font-size: 11px; color: var(--sys-text-subtle); }

.empty-state-cell { text-align: center; padding: 40px; color: var(--sys-text-subtle); }
.text-right { text-align: right; }