@layer pages {
  .mpt-compare { padding-block: 42px; border-bottom: 1px solid var(--mpt-line); }
  .mpt-compare h2 { margin-bottom: 24px; }
  .mpt-compare-controls { display: flex; flex-wrap: wrap; gap: 8px; }
  .mpt-compare-controls button { min-height: 48px; padding: 10px 16px; font-size: 16px; color: var(--mpt-violet); background: transparent; border: 1px solid var(--mpt-line); border-radius: 8px; line-height: 1.5; }
  .mpt-compare-controls button[aria-pressed="true"] { background: var(--mpt-violet); color: var(--mpt-ink); border-color: var(--mpt-violet); }
  .mpt-compare-status { font-size: 16px; color: var(--mpt-muted); margin-top: 18px; }
  .mpt-compare-panels { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 20px; }
  .mpt-compare-panels[data-mpt-single="true"] { grid-template-columns: minmax(0, 1fr); }
  .mpt-setting { border: 1px solid var(--mpt-line); border-radius: 12px; background: var(--mpt-panel); padding: 25px; min-width: 0; }
  .mpt-setting h3 { margin-block: 10px 18px; }
  .mpt-setting p, .mpt-setting li { font-size: 18px; line-height: 1.65; }
  @media (max-width: 650px) {
    .mpt-compare { padding-block: 32px; }
    .mpt-compare-panels { grid-template-columns: minmax(0, 1fr); }
    .mpt-setting { padding: 21px; }
    .mpt-compare-controls { gap: 7px; }
    .mpt-compare-controls button { flex-grow: 1; padding-inline: 12px; }
  }
}
