/* Staff stats sparklines and ranked lists. */

.spark { width: 100%; height: 34px; margin-top: 6px; }
.spark rect { fill: var(--violet); opacity: .85; transform-origin: bottom; transform-box: fill-box; animation: grow-y .7s var(--ease-out) both; transition: opacity var(--t-fast); }
.spark rect:hover { opacity: 1; fill: var(--sky); }
@keyframes grow-y { from { transform: scaleY(0); } }
.ranked { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.ranked li { display: grid; grid-template-columns: minmax(0, 1.2fr) 1fr 36px; align-items: center; gap: 12px; font-size: 13px; font-weight: 600; }
.ranked-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ranked .bar-fill { background: var(--nebula); }
/* Health page */
.health-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.health-check h2 { font-size: 15px; margin: 0; }
.health-check .small { margin-top: 6px; display: flex; flex-direction: column; gap: 4px; }
.health-dot { width: 10px; height: 10px; border-radius: 50%; flex: none; background: var(--danger); box-shadow: 0 0 0 4px rgba(255, 122, 138, .15); }
.health-dot.ok { background: var(--ok); box-shadow: 0 0 0 4px rgba(20, 154, 92, .15); }
.health-dot.warn { background: var(--warn); box-shadow: 0 0 0 4px rgba(247, 201, 92, .15); }
.log-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.log-list li { display: grid; grid-template-columns: 90px 1fr; gap: 8px; padding: 6px 8px; border-radius: var(--radius-sm); background: var(--surface-2); border-left: 3px solid var(--warn); }
.log-list li.error { border-left-color: var(--danger); }
.log-list pre { margin: 0; font-size: 12px; white-space: pre-wrap; word-break: break-word; max-height: 160px; overflow: auto; }
@media (max-width: 600px) { .log-list li { grid-template-columns: 1fr; } }