.compare-mobile { display: none; }
@media (max-width: 700px) {
  .compound-compare-page .container, .compound-compare-page .compare-output { min-width: 0; max-width: 100%; }
  .compound-compare-page .compare-control-card { padding: 20px !important; }
  .compound-compare-page .compare-picker { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .compound-compare-page .compare-picker button { min-width: 0; border-radius: 12px; padding: 12px; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; text-align: left; overflow-wrap: anywhere; line-height: 1.3; }
  .compound-compare-page .compare-picker small { font-size: .75rem; line-height: 1.3; }
  .compound-compare-page .compare-table-wrap { display: none; }
  .compare-mobile { display: grid; gap: 14px; margin-top: 22px; }
  .compare-mobile-section { border: 1px solid var(--glass-border, var(--border)); border-radius: 14px; overflow: hidden; background: var(--glass-bg, var(--surface)); color: var(--glass-ink, var(--ink)); box-shadow: 0 12px 30px rgba(0,0,0,.13); }
  .compare-mobile-section h3 { margin: 0; padding: 16px 18px; font-size: 1.15rem; line-height: 1.3; border-bottom: 1px solid var(--glass-border, var(--border)); color: inherit; }
  .compare-mobile-entry { padding: 14px 18px; overflow-wrap: anywhere; }
  .compare-mobile-entry + .compare-mobile-entry { border-top: 1px solid var(--glass-border, var(--border)); }
  .compare-mobile-entry a { color: inherit; font-weight: 700; font-size: 1rem; text-decoration: underline; text-underline-offset: .18em; }
  .compare-mobile-entry p { color: inherit; font-size: .98rem; line-height: 1.5; margin: 6px 0 0; white-space: normal; }
}
@media (max-width: 340px) { .compound-compare-page .compare-picker { grid-template-columns: 1fr; } }
