/* CMC matching — full-page layout.
   The workspace itself is styled by style.css (.mw, .mq-item, .sig, .bx-*),
   unchanged from when it lived in the modal. This file only replaces the
   dialog box it used to sit in with a page, which is what buys it the width
   to show the evidence and the candidate side by side. */

body.mx {
  height: auto;
  min-height: 100%;
  background: var(--bg);
}

.mx-shell {
  max-width: 1600px;
  margin: 0 auto;
  padding: var(--s5);
}

#mxBody {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  box-shadow: var(--shadow-1);
  padding: var(--s5);
  min-height: calc(100vh - 160px);
}

.mx-note { padding: var(--s3) var(--s1); font-size: var(--t-xs); color: var(--muted); }
.mx-note.err { color: var(--bad); font-weight: 600; }
.mx-note.ok  { color: var(--ok);  font-weight: 600; }

/* The queue and the detail pane get the full page height instead of a modal's
   fixed 60vh, which is what made the candidate list scroll in a slot. */
body.mx .mw { min-height: calc(100vh - 340px); }
body.mx .mw-list { max-height: calc(100vh - 340px); }
body.mx .mw-detail { max-height: calc(100vh - 340px); }

@media (max-width: 900px) {
  .mx-shell { padding: var(--s3); }
  #mxBody { padding: var(--s4); }
  body.mx .mw, body.mx .mw-list, body.mx .mw-detail { max-height: none; min-height: 0; }
}