/* Dense comparisons stay at reading size on phones instead of shrinking a
   desktop SVG. The existing facet layout remains for synthetic categories. */
.ch-mobile { display: none; }
text.ch-axis { fill: #616975; }
.ch-note { color: #616975; }
.ch-bar:focus-visible { outline: 2px solid #273648; outline-offset: 3px; }
.ch-pill:focus-visible, .ch-table-btn:focus-visible,
.ch-group-select select:focus-visible { outline: 2px solid #273648; outline-offset: 3px; }

@media screen and (max-width: 600px) {
  .ch-has-mobile > .ch-plots, .ch-has-mobile > .ch-legend { display: none; }
  .ch-mobile { display: block; margin-top: 0.85rem; }
  .ch-controls { align-items: center; gap: 0.5rem; }
  .ch-pill, .ch-table-btn { min-height: 42px; font-size: 0.85rem; }
  .ch-metrics { align-items: center; gap: 0.2rem; }
  .ch-group-select { display: flex; align-items: center; gap: 0.8rem; font-size: 0.9rem; color: #4b5563; }
  .ch-group-select select {
    flex: 1; min-width: 0; min-height: 44px; padding: 0.45rem 0.65rem;
    border: 1px solid #c9ced6; border-radius: 8px; background: #fff;
    font-family: inherit; font-size: 1rem; color: #283240;
  }
  .ch-mobile-unit { margin: 0.7rem 0 0.85rem !important; font-size: 0.82rem; color: #616975; }
  .ch-mobile-row { margin-bottom: 0.85rem; }
  .ch-mobile-heading { display: flex; justify-content: space-between; align-items: baseline; gap: 0.6rem; margin-bottom: 0.3rem; }
  .ch-mobile-heading .ch-leg { font-size: 0.9rem; color: #374151; }
  .ch-mobile-value { flex-shrink: 0; font-size: 0.95rem; font-weight: 600; font-variant-numeric: tabular-nums; color: #283240; }
  .ch-mobile-track { height: 14px; border-radius: 4px; background: #eef0f3; overflow: hidden; }
  .ch-mobile-bar { height: 100%; border-radius: 4px; box-shadow: inset 0 0 0 1px rgba(11, 11, 11, 0.14); }
  .ch-mobile-axis { display: flex; justify-content: space-between; font-size: 0.78rem; color: #616975; }
  .ch-mobile-scale { margin: 0.25rem 0 0.85rem !important; font-size: 0.76rem; color: #616975; }
  .ch-note { font-size: 0.84rem; line-height: 1.5; }
  .ch-facet { flex-basis: 100%; }
}