/* dashboard
   The home dashboard.

   Loaded by `stylesheet_link_tag :app`, which includes every .css under
   app/assets sorted by filename — so the NUMBER PREFIX IS THE CASCADE ORDER.
   Renaming a file moves it in the cascade. */

/* ---------------- dashboard ---------------- */
.tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; }
.tile {
  display: block; text-decoration: none;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r); padding: 16px 18px;
}
.tile:hover { border-color: var(--line-2); }
.tile.is-alert { border-color: var(--danger); }
.tile-label { font: 500 10px var(--ui); text-transform: uppercase; letter-spacing: .07em; color: var(--ink-3); }
.tile-value { font: 600 24px var(--ui); letter-spacing: -0.02em; color: var(--ink); margin-top: 6px; }
.tile.is-alert .tile-value { color: var(--danger); }
.tile-note { font-size: 12px; color: var(--ink-3); margin-top: 2px; }

.attention-row {
  display: flex; align-items: baseline; justify-content: space-between; gap: 14px;
  padding: 9px 18px; text-decoration: none; color: var(--ink); font-size: 13.5px;
}
.attention-row:hover { background: var(--paper); }
.attention-main { display: flex; gap: 8px; align-items: baseline; min-width: 0; }
.attention-main .muted { font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.attention-right { text-align: right; flex-shrink: 0; }
.attention-right.is-alert { color: var(--danger); }
.attention-note { display: block; font-size: 11.5px; color: var(--ink-3); }