/* One semantic table, with grouped comparison rows on small screens. */
.compare-matrix-caption{margin:0 0 16px;font:400 13px/1.6 Geist,sans-serif;color:var(--muted);max-width:72ch}
.compare-matrix-surface{border:1px solid var(--line);border-radius:20px;overflow:hidden;background:var(--surface);}
.compare-matrix{min-width:0;table-layout:fixed;border-collapse:separate;border-spacing:0;font:400 14px/1.6 Geist,sans-serif;font-variant-numeric:tabular-nums}
.compare-matrix .compare-topic-column{width:19%}
.compare-matrix th,.compare-matrix td{padding:24px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line);border-right:1px solid var(--line);line-height:1.6}
.compare-matrix tr>:last-child{border-right:0}
.compare-matrix thead th{padding:24px;vertical-align:middle;background:var(--paper);font-weight:600;color:var(--ink)}
.compare-matrix thead th:first-child{font-size:12px;color:var(--muted);font-weight:500}
.compare-matrix tbody th{font-size:14px;font-weight:600;letter-spacing:-.01em;color:var(--ink);background:color-mix(in srgb,var(--surface) 70%,var(--paper))}
.compare-matrix td{color:var(--ink-2);transition:background-color .18s ease}
.compare-matrix tbody tr:last-child>*{border-bottom:0}
.compare-matrix .compare-moonshot{background:color-mix(in srgb,var(--surface) 94%,var(--accent))}
.compare-matrix thead .compare-moonshot{position:relative;background:color-mix(in srgb,var(--surface) 89%,var(--accent));}
.compare-matrix-brand{display:flex;align-items:center;gap:10px;font-size:15px;line-height:1.25;font-weight:600;color:var(--ink)}
.compare-matrix-brand img{display:block;flex-shrink:0;width:28px;height:28px;object-fit:contain;border-radius:7px;background:#fff;outline:1px solid rgba(0,0,0,.1)}
[data-theme=dark] .compare-matrix-brand img{outline-color:rgba(255,255,255,.1)}
.compare-matrix-copy{text-wrap:pretty;overflow-wrap:break-word}
.compare-matrix-copy a{color:var(--ink);text-decoration-color:var(--line-2);text-underline-offset:4px;text-decoration-thickness:1px;transition:color .18s ease,text-decoration-color .18s ease}
.compare-matrix-copy a:hover{color:var(--accent);text-decoration-color:var(--accent)}
.compare-mobile-brand{display:none}
@media(hover:hover){.compare-matrix tbody tr:hover td{background:var(--paper)}.compare-matrix tbody tr:hover .compare-moonshot{background:color-mix(in srgb,var(--surface) 88%,var(--accent))}}
@media(min-width:761px) and (max-width:1000px){.compare-matrix th,.compare-matrix td,.compare-matrix thead th{padding:20px 16px}.compare-matrix-brand{font-size:14px;gap:8px}}
@media(max-width:760px){
  .compare-matrix-surface{border:0;border-radius:0;overflow:visible;background:transparent;}
  .compare-matrix,.compare-matrix tbody,.compare-matrix tr,.compare-matrix th,.compare-matrix td{display:block;width:auto}
  .compare-matrix colgroup{display:none}
  .compare-matrix thead{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .compare-matrix tbody{display:grid;gap:20px}
  .compare-matrix tbody tr{border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--surface);}
  .compare-matrix th,.compare-matrix td{padding:20px;border-right:0}
  .compare-matrix tbody th{font-size:16px;padding:18px 20px;background:var(--paper)}
  .compare-matrix tbody tr:last-child>*{border-bottom:1px solid var(--line)}
  .compare-matrix tbody tr>td:last-child{border-bottom:0}
  .compare-mobile-brand{display:block;margin-bottom:10px}
  .compare-matrix-brand{font-size:13px;gap:9px}
  .compare-matrix-brand img{width:24px;height:24px;border-radius:6px}
}

.compare-matrix thead .compare-moonshot::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--accent)}