/* ============================================================
   v23.7 — WIDGET MÉTRO STM (au-dessus de la liste d'entraves)
   ============================================================ */
.metro-widget {
  margin: 0.55rem 0.7rem 0.35rem;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--panel);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  font-size: 0.8rem;
}
.mw-head {
  display: flex; align-items: center; gap: 0.5rem;
  padding: 0.5rem 0.7rem; cursor: default;
  background: linear-gradient(90deg, rgba(0,137,208,.08), rgba(0,165,51,.06), rgba(245,130,32,.05));
}
.mw-title { font-weight: 800; font-size: 0.8rem; letter-spacing: 0.01em; }
.mw-health { margin-left: auto; font-size: 0.68rem; font-weight: 800; white-space: nowrap; }
.mw-toggle {
  border: none; background: transparent; cursor: pointer;
  font-size: 0.9rem; color: var(--ink-soft); padding: 0.1rem 0.3rem; border-radius: 8px;
}
.mw-toggle:hover { background: var(--accent-soft, rgba(226,73,47,.08)); }
.mw-body { display: none; padding: 0 0.6rem 0.55rem; }
.mw-body.open { display: block; }

.mw-pills { display: flex; gap: 0.4rem; padding: 0.35rem 0 0.45rem; flex-wrap: wrap; }
.mw-pill {
  display: inline-flex; align-items: center; gap: 0.32rem;
  font: 700 0.78rem/1 inherit; font-family: inherit;
  border: 1px solid var(--line); background: var(--panel); color: var(--ink);
  border-radius: 999px; padding: 0.34rem 0.6rem; cursor: pointer;
}
.mw-pill i { width: 0.72rem; height: 0.72rem; border-radius: 50%; display: inline-block; }
.mw-pill b { color: var(--ink-soft); font-size: 0.7rem; }
.mw-pill.on { border-color: var(--accent, #d64500); background: var(--accent-soft, rgba(226,73,47,.08)); }
.mw-pill.on b { color: var(--accent, #d64500); }

.mw-sub { font-size: 0.66rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-soft); display: flex; align-items: center; gap: 0.5rem; margin: 0.15rem 0 0.3rem; }
.mw-all { border: 1px solid var(--line); background: var(--panel); border-radius: 999px; font: 600 0.64rem/1 inherit; font-family: inherit; padding: 0.22rem 0.5rem; cursor: pointer; color: var(--ink-soft); }
.mw-all.on { opacity: 0.55; cursor: default; }
.mw-rows { display: grid; gap: 0.28rem; }
.mw-row {
  display: flex; align-items: center; gap: 0.5rem;
  border: 1px solid var(--line); border-radius: 10px; padding: 0.38rem 0.55rem;
  background: var(--panel);
}
.mw-dot { width: 0.6rem; height: 0.6rem; border-radius: 50%; flex: 0 0 auto; }
.mw-where { display: flex; flex-direction: column; min-width: 0; }
.mw-where b { font-size: 0.76rem; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mw-where small { color: var(--ink-soft); font-size: 0.66rem; }
.mw-evac { color: #c0392b; font-weight: 700; }
.mw-cause { margin-left: auto; font-size: 0.66rem; color: var(--ink-soft); text-align: right; max-width: 38%; }
.mw-empty { color: var(--ink-soft); font-size: 0.74rem; padding: 0.3rem; }
.mw-src { font-size: 0.6rem; color: var(--ink-soft); opacity: 0.75; margin-top: 0.35rem; }