.healthStrip { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; margin-bottom: 16px; } .tableSection { background: var(--bg-surface); border: 1px solid var(--border-subtle); border-radius: var(--radius-lg); box-shadow: var(--shadow-card); overflow: hidden; } .tableHeader { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; border-bottom: 1px solid var(--border-subtle); } .tableTitle { font-size: 13px; font-weight: 600; color: var(--text-primary); } .tableRight { display: flex; align-items: center; gap: 10px; } .tableMeta { font-size: 11px; color: var(--text-muted); font-family: var(--font-mono); } .panelSection { padding-bottom: 16px; margin-bottom: 16px; border-bottom: 1px solid var(--border-subtle); } .panelSection:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; } .panelSectionTitle { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; color: var(--text-muted); margin-bottom: 10px; } .overviewGrid { display: flex; flex-direction: column; gap: 8px; } .overviewRow { display: flex; align-items: flex-start; gap: 12px; } .overviewLabel { font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.6px; color: var(--text-muted); width: 90px; flex-shrink: 0; padding-top: 2px; } .openDetailLink { display: inline-block; font-size: 13px; font-weight: 600; color: var(--accent, #c6820e); cursor: pointer; background: none; border: none; padding: 0; text-decoration: none; } .openDetailLink:hover { text-decoration: underline; }