/* Home (hm-*): only what docs/ui-design/frs.css does not already give the .m-* components (page, head, kpis, card, task,
   status, meter, feed, banner, sheet, empty). */
.hm-cols { align-items: start; }
.hm-side { display: flex; flex-direction: column; gap: 20px; min-width: 0; }

/* KPI tiles are links to the MIS; the figure keeps the one font */
a.m-kpi { color: inherit; text-decoration: none; transition: border-color .15s ease, box-shadow .2s ease; }
a.m-kpi:hover { border-color: var(--line-2); box-shadow: var(--sh-2); text-decoration: none; }
.hm-tl { font-size: 12.5px; font-weight: 500; color: var(--ink-3); }
.hm-tv small { text-transform: none; }
.hm-note { font-size: 14px; line-height: 34px; font-weight: 500; color: var(--ink-3); }

/* blocked banner */
.hm-block-r { display: block; }
a.m-banner { color: inherit; text-decoration: none; }
a.m-banner:hover { text-decoration: none; }
.m-banner .ico .ic { width: 18px; height: 18px; }

/* Needs you now */
.hm-rows { border-top: 1px solid var(--line); }
.m-task .ico .ic { width: 18px; height: 18px; }
.m-task .chev { width: 16px; height: 16px; }
.m-task small { color: var(--ink-3); }
.hm-quiet { border-top: 1px solid var(--line); }
.m-empty .ico.hm-ok { background: var(--ok-tint); color: var(--ok); }
.hm-ok .ic { width: 24px; height: 24px; stroke-width: 2.2; }
.hm-wait { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; padding: 12px 20px; border-top: 1px solid var(--line); }
.hm-wait .m-badge { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.hm-skel { display: grid; gap: 12px; padding: 18px 20px; border-top: 1px solid var(--line); }
.hm-skl { display: block; height: 14px; border-radius: 7px; background: linear-gradient(90deg, var(--sunken) 25%, #e9e6e1 50%, var(--sunken) 75%); background-size: 200% 100%; animation: m-shimmer 1.6s linear infinite; }

/* month card */
.hm-month { display: flex; flex-direction: column; gap: 14px; }
.hm-checks { display: flex; justify-content: space-between; font-size: 13px; }

/* recent activity */
.hm-feed { padding-bottom: 8px; }
.hm-ev { font-size: 13.5px; line-height: 19px; color: var(--ink-2); text-decoration: none; }
.hm-ev b { color: var(--ink); font-weight: 600; }
a.hm-ev:hover { color: var(--ink); text-decoration: none; }
.m-feed time { text-align: right; }

/* View all sheet */
.m-sheet__head .grow { flex: 1; min-width: 0; }
.hm-sheet-bar { padding: 12px 20px; border-bottom: 1px solid var(--line); }
.hm-day { padding: 14px 20px 2px; font-size: 12.5px; font-weight: 500; color: var(--ink-3); }
.hm-more { display: flex; justify-content: center; padding: 14px; }
.m-sheet .m-empty { padding: 48px 24px; }

/* phone: read only. Two tiles a row, the Needs-you rows carry a "Laptop" chip instead of a link */
@media (max-width: 760px) {
  .hm-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hm-kpis .m-kpi { padding: 14px 14px 12px; }
  .hm-kpis .fig { font-size: 24px; line-height: 28px; }
  .m-task.hm-ph { grid-template-columns: minmax(0, 1fr) auto; padding: 12px 16px; }
  .hm-wait { padding: 12px 16px; }
  .m-card__head { padding: 14px 16px; }
  .m-card__body { padding: 0 16px 16px; }
  .m-status li { padding: 10px 12px; }
}