.side-column { display: grid; grid-template-rows: minmax(0, 0.94fr) minmax(0, 1fr); gap: 14px; min-height: 0; height: 100%; } .side-panel { padding: 12px; gap: 8px; } .side-panel .section-head { min-height: 24px; margin-bottom: 0; } .side-panel .section-head h2 { font-size: 15px; } .side-card-head { align-items: center; } .detail-action { display: inline-flex; align-items: center; justify-content: center; gap: 4px; min-height: 26px; padding: 0 6px; border: 1px solid transparent; border-radius: 4px; background: transparent; color: var(--workbench-muted); font-size: 13px; font-weight: 800; white-space: nowrap; transition: border-color 180ms var(--ease), background-color 180ms var(--ease), color 180ms var(--ease); } .detail-action:hover { border-color: rgba(var(--theme-primary-rgb, 58, 124, 165), 0.18); background: var(--workbench-primary-soft); color: var(--workbench-primary-active); } .detail-action i { font-size: 16px; } .expense-stats-panel, .usage-profile-panel { min-height: 0; display: grid; grid-template-rows: auto minmax(0, 1fr); } .insight-metric-list, .insight-profile-list { min-height: 0; display: grid; gap: 6px; grid-auto-rows: minmax(0, 1fr); overflow: hidden; } .insight-metric-row, .insight-profile-card { display: grid; grid-template-columns: 18px minmax(0, 1fr) auto; align-items: center; gap: 8px; min-height: 0; padding: 7px 9px; border: 1px solid rgba(var(--theme-primary-rgb, 58, 124, 165), 0.12); border-left: 2px solid rgba(var(--theme-primary-rgb, 58, 124, 165), 0.3); border-radius: 4px; background: linear-gradient(135deg, rgba(255, 255, 255, 0.76), rgba(255, 255, 255, 0.58)), rgba(var(--theme-primary-rgb, 58, 124, 165), 0.026); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.68), inset 0 -1px 0 rgba(var(--theme-primary-rgb, 58, 124, 165), 0.055); backdrop-filter: blur(10px) saturate(1.16); -webkit-backdrop-filter: blur(10px) saturate(1.16); transition: border-color 180ms var(--ease), background-color 180ms var(--ease); } .insight-metric-row:hover, .insight-profile-card:hover { border-color: rgba(var(--theme-primary-rgb, 58, 124, 165), 0.22); background: linear-gradient(135deg, rgba(255, 255, 255, 0.82), rgba(255, 255, 255, 0.64)), rgba(var(--theme-primary-rgb, 58, 124, 165), 0.04); } .insight-metric-icon, .insight-profile-icon { display: inline-flex; align-items: center; justify-content: center; color: var(--workbench-muted); font-size: 16px; } .insight-metric-label, .insight-profile-label { min-width: 0; overflow: hidden; color: var(--workbench-muted); font-size: 12px; font-weight: 650; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; } .insight-metric-value, .insight-profile-value { min-width: 0; overflow: hidden; color: var(--workbench-ink); font-size: 14px; font-weight: 850; line-height: 1.15; text-align: right; text-overflow: ellipsis; white-space: nowrap; font-variant-numeric: tabular-nums; } .insight-metric-value small, .insight-profile-value small { margin-left: 2px; color: var(--workbench-muted); font-size: 11px; font-weight: 700; } .insight-metric-row--amount .insight-metric-icon, .insight-metric-row--amount .insight-metric-value { color: var(--workbench-primary-active); } .insight-metric-row--warning .insight-metric-icon, .insight-metric-row--warning .insight-metric-value { color: var(--warning); } .insight-metric-row--info .insight-metric-icon, .insight-metric-row--info .insight-metric-value { color: var(--workbench-chart-blue); } .insight-profile-hint { display: none; } .insight-profile-copy { min-width: 0; display: contents; }