/* Money At A Glance (Oct 22 2026, Travis: "at a glance i know when i click invoicing what needs my attention") */
.mg .stat.has-gauge { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; column-gap: 8px; }
.mg .stat.has-gauge > span, .mg .stat.has-gauge > b, .mg .stat.has-gauge > em { grid-column: 1; }
.mg .stat.has-gauge > .gauge { grid-column: 2; grid-row: 1 / span 3; }
.mg .stat em { display: block; font-style: normal; font-size: .72rem; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mg .gauge { display: block; width: 46px; height: 28px; flex: none; }
.mg .gauge path { fill: none; stroke-width: 6; stroke-linecap: round; }
.mg .gauge .track { stroke: var(--line); }
.mg .gauge .val { stroke: var(--grass); }
.mg .gauge.warn .val { stroke: var(--orange); }
.mg .gauge.bad .val { stroke: var(--red); }
.mg .stat.warn b { color: var(--orange); }
.mg .stat.bad b { color: var(--red); }
.mg h3 { margin: 14px 0 6px; font-size: .95rem; }
.mg .mg-t { width: 100%; margin-top: 6px; }
.mg .mg-t tr.mg-sum td { font-weight: 700; }
.mg .mg-pipe { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
.mg .mg-pipe .stat { position: relative; }
@media (max-width: 600px) {
  .mg .stats { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .mg .stat b { font-size: 1.05rem; overflow-wrap: anywhere; }
  .mg .stat.has-gauge { grid-template-columns: minmax(0, 1fr); }
  .mg .stat.has-gauge > .gauge { grid-column: 1; grid-row: auto; margin-top: 4px; }
  .mg .mg-pipe { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 600px) { .mg .mg-t th, .mg .mg-t td { padding: 6px 4px; font-size: .78rem; } .mg .mg-t th { letter-spacing: 0; } }
@media (max-width: 600px) { .mg .mg-t tr:first-child { display: table-row !important; } .mg .mg-t th { display: table-cell !important; font-size: .7rem; } }
@media (max-width: 600px) { .mg .mg-t .mg-hp { display: none !important; } }
/* Oct 22 2026 (rules check: no wrapping): long customer names cut with an ellipsis on phones instead of wrapping */
@media (max-width: 600px) { .mg td.t-main a { display: block; max-width: 44vw; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } }
/* Oct 23 2026: Done, Not Billed Yet (1.4.388) has a plain-text Property t-main cell that wrapped at 390; every t-main cell is now one line
   that takes the table's spare width (no wrap, "…" only when it truly doesn't fit). */
@media (max-width: 600px) { .mg .mg-t td.t-main { max-width: 0; width: 50%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .mg .mg-t td.t-main a { max-width: 100%; } .mg .mg-t td.mg-prop { white-space: nowrap; } }
.mg .mg-t td.mg-prop { white-space: nowrap; }
body:not(.ps):not(.site) main .card .mg-t td[data-label="Property"], body:not(.ps):not(.site) main .mg .mg-t td[data-label="Property"].t-main { max-width: none; width: auto; white-space: nowrap; overflow: visible; text-overflow: clip; }