.compare-dialog[open] { width:min(1400px,96vw); height:min(920px,94dvh); max-height:94dvh; }
.compare-controls { display:flex; gap:10px; align-items:center; flex-wrap:wrap; padding:12px 20px; border-bottom:1px solid var(--line); }
.compare-controls label { display:flex; gap:8px; align-items:center; min-width:0; }
.compare-controls select { max-width:300px; min-width:0; background:var(--panel); color:var(--tx); padding:8px; border:1px solid var(--line2); border-radius:6px; font:inherit; }
.compare-controls svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.8; }
.compare-pair { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; padding:14px 20px; border-bottom:1px solid var(--line); }
.compare-pair[hidden] { display:none; }
.compare-pair h3 { margin:0 0 6px; font-size:13px; overflow-wrap:anywhere; }
.compare-pair p { margin:4px 0; font-size:12px; overflow-wrap:anywhere; }
.compare-pair small { display:block; color:var(--mut); overflow-wrap:anywhere; line-height:1.5; }
.compare-note,.compare-meta { padding:8px 20px; font-size:12px; color:var(--mut); border-bottom:1px solid var(--line); margin:0; }
.compare-meta p { margin:4px 0; }
.compare-meta label { display:block; margin-top:8px; }
.compare-body { display:grid; grid-template-columns:minmax(170px,1fr) minmax(0,4fr); flex:1; min-height:0; }
.compare-dimensions { border-right:1px solid var(--line); padding:10px 8px; overflow:auto; }
.context-ui .compare-dimensions button { display:flex; justify-content:space-between; align-items:center; width:100%; text-align:left; margin:0 0 4px; gap:8px; padding:12px; border:0; }
.compare-dimensions button[aria-pressed="true"] { background:var(--panel2); color:var(--acc); }
.compare-list { display:flex; flex-direction:column; min-width:0; min-height:0; }
.compare-results { overflow:auto; flex:1; min-height:0; }
.compare-row { border-bottom:1px solid var(--line); }
.compare-row > summary { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:15px 18px; cursor:pointer; }
.compare-row > summary > span:first-child { min-width:0; }
.compare-row strong { font-size:13px; overflow-wrap:anywhere; }
.compare-row small { display:block; font-size:11px; color:var(--mut); margin-top:4px; overflow-wrap:anywhere; }
.compare-state { flex:none; font-size:11px; padding:4px 6px; border-radius:4px; background:var(--panel2); color:var(--mut); }
.compare-only_b,.compare-different { color:var(--acc); }
.compare-unknown { color:var(--warn,#a76816); }
.compare-sides { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); border-top:1px solid var(--line); background:var(--panel2); }
.compare-side { padding:12px 18px; min-width:0; }
.compare-side + .compare-side { border-left:1px solid var(--line); }
.compare-side h3 { margin:0 0 10px; font-size:13px; }
.compare-side dl { display:grid; grid-template-columns:minmax(90px,1fr) minmax(0,2fr); gap:8px 12px; margin:10px 0; }
.compare-side dt { color:var(--mut); }
.compare-side dd { margin:0; overflow-wrap:anywhere; }
.compare-dimensions small { color:var(--mut); }
.compare-side pre { font:12px/1.6 ui-monospace,SFMono-Regular,monospace; white-space:pre-wrap; overflow-wrap:anywhere; max-height:140px; overflow:auto; margin:8px 0; }
.compare-side select { width:100%; min-width:0; margin:10px 0 4px; padding:6px; background:var(--panel); color:var(--tx); border:1px solid var(--line2); border-radius:4px; }
.compare-links { display:flex; gap:6px; flex-wrap:wrap; margin-top:6px; }
.compare-empty { padding:20px; color:var(--mut); }
.compare-list > button { align-self:center; margin:10px; }
.compare-coverage { border-top:1px solid var(--line); padding:10px 20px; color:var(--mut); font-size:12px; }
.compare-coverage summary { cursor:pointer; }
.compare-coverage pre { max-height:140px; overflow:auto; overflow-wrap:anywhere; white-space:pre-wrap; font-size:11px; }
#compare-reader-dialog { width:min(1100px,96vw); height:min(800px,90dvh); }
#compare-reader { display:flex; flex:1; min-height:0; }
#compare-reader #content-expand { display:none; }
#compare-return { border:1px solid var(--line2); background:var(--panel); color:var(--acc); border-radius:6px; padding:6px 10px; cursor:pointer; }
@media(max-width:720px) {
  .compare-controls,.compare-note,.compare-meta,.compare-pair { padding:10px 14px; }
  .compare-controls label:has(select) { flex:1 1 120px; }
  .compare-controls select { width:100%; }
  .compare-controls #compare-refresh { margin-left:auto; }
  .compare-meta #compare-task-note { max-height:3em; overflow:auto; }
  .compare-meta #compare-summary { display:none; }
  .compare-note { font-size:11px; }
  .compare-pair section { min-width:0; }
  .compare-body { display:flex; flex-direction:column; }
  .compare-dimensions { display:flex; flex:none; padding:6px; border-right:0; border-bottom:1px solid var(--line); }
  .context-ui .compare-dimensions button { flex:1; padding:8px 6px; font-size:11px; flex-direction:column; }
  .compare-list { flex:1; }
  .compare-pair { gap:12px; max-height:22dvh; overflow:auto; }
  .compare-row > summary { padding:12px; align-items:flex-start; }
  .compare-state { max-width:90px; white-space:normal; }
  .compare-sides { grid-template-columns:minmax(0,1fr); }
  .compare-side + .compare-side { border-left:0; border-top:1px solid var(--line); }
}
