/* Mercado · prefijo .scr-mercado / mk- */
.scr-mercado {
  --m-s1: var(--s1, #12151a); --m-s2: var(--s2, #1a1e25);
  --m-line: var(--line, #262b33); --m-ink: var(--ink, #e8ebf0); --m-muted: var(--ink-3, #7d8696);
  --m-mono: var(--font-num, "Geist Mono", ui-monospace, monospace);
  --tc-compra: var(--t-compra, #3DDC97); --tc-venta: var(--t-venta, #FF6B6B); --tc-cambio: var(--t-cambio, #4C8DFF); --tc-puja: var(--t-puja, #F2A541); --tc-duelo: var(--t-duelo, #B061FF); --tc-dealer: var(--t-dealer, #2EC4B6); --tc-anuncio: var(--t-anuncio, #9AA4B8);
  color: var(--m-ink); min-width: 0;
}
/* #screen also carries .scr-mercado (app.js); the 2/3 + 1/3 grid lives only on the inner div */
.screen.scr-mercado { display: block; }
.scr-mercado:not(.screen):not(.is-hist) { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 14px; height: 100%; min-height: 0; }
.scr-mercado .mk-main { min-width: 0; min-height: 0; overflow: auto; }
.scr-mercado * { border-radius: 0; box-sizing: border-box; }
.scr-mercado.is-hist { display: flex; flex-direction: column; }
.scr-mercado .mk-muted { color: var(--m-muted); font-size: 12px; }
.scr-mercado .mk-grow { flex: 1; }
.scr-mercado .mk-mono { font-family: var(--m-mono); font-variant-numeric: tabular-nums; font-size: 12px; white-space: nowrap; }
.scr-mercado .mk-r { text-align: right; }
.scr-mercado .mk-state { padding: 20px; color: var(--m-muted); border: 1px solid var(--m-line); background: var(--m-s1); font-size: 13px; }
.scr-mercado .mk-state.mk-error { color: #ff6b6b; }
.scr-mercado .mk-head { display: flex; align-items: baseline; gap: 12px; margin-bottom: 10px; }
.scr-mercado .mk-head h1 { margin: 0; font-size: 18px; }
.scr-mercado .mk-head-sub { font-family: var(--m-mono); }

.scr-mercado .mk-t-compra { --tc: var(--tc-compra); } .scr-mercado .mk-t-venta { --tc: var(--tc-venta); }
.scr-mercado .mk-t-cambio { --tc: var(--tc-cambio); } .scr-mercado .mk-t-puja { --tc: var(--tc-puja); }
.scr-mercado .mk-t-duelo { --tc: var(--tc-duelo); } .scr-mercado .mk-t-dealer { --tc: var(--tc-dealer); }
.scr-mercado .mk-t-anuncio { --tc: var(--tc-anuncio); }
.scr-mercado .mk-chip { display: inline-flex; align-items: center; font-size: 11px; padding: 2px 6px; background: color-mix(in srgb, var(--tc) 22%, transparent); border-left: 2px solid var(--tc); white-space: nowrap; }
.scr-mercado .mk-team { font-size: 11px; padding: 2px 6px; background: var(--m-s2); }
.scr-mercado .mk-team.is-us { background: var(--m-ink); color: #0b0d10; font-weight: 600; }

/* chats */
.scr-mercado .mk-chats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; align-items: start; }
.scr-mercado .mk-chats > .mk-state { grid-column: 1 / -1; }
.scr-mercado .mk-chat { display: flex; flex-direction: column; background: var(--m-s1); border: 1px solid var(--m-line); border-top: 2px solid var(--tc-dealer); min-width: 0; }
.scr-mercado .mk-chat.is-final { border-top-color: var(--tc-venta); }
.scr-mercado .mk-chat-h { display: flex; align-items: center; gap: 10px; padding: 10px 12px 4px; }
.scr-mercado .mk-chat-who { font-size: 14px; flex: 1; }
.scr-mercado .mk-status { font: 11px var(--m-mono); padding: 2px 6px; color: var(--tc-puja); background: color-mix(in srgb, var(--tc-puja) 15%, transparent); }
.scr-mercado .mk-status.is-final { color: var(--tc-venta); background: color-mix(in srgb, var(--tc-venta) 15%, transparent); }
.scr-mercado .mk-chat-sub { display: flex; justify-content: space-between; gap: 8px; padding: 2px 12px 8px; font: 12px var(--m-mono); }
.scr-mercado .mk-chat-bar { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 4px 12px 10px; border-bottom: 1px solid var(--m-line); }
.scr-mercado .mk-lims { font: 11px var(--m-mono); color: var(--m-muted); white-space: nowrap; }
.scr-mercado .mk-pbar-fallback { font: 11px var(--m-mono); color: var(--m-muted); }
.scr-mercado .mk-msgs { display: flex; flex-direction: column; gap: 8px; padding: 10px 12px; max-height: 340px; overflow: auto; }
.scr-mercado .mk-msg { max-width: 82%; padding: 6px 10px; border-left: 2px solid var(--tc-dealer); background: var(--m-s2); font-size: 12px; }
.scr-mercado .mk-msg.is-us { align-self: flex-end; border-left: 0; border-right: 2px solid var(--m-ink); }
.scr-mercado .mk-msg.is-final { box-shadow: inset 0 0 0 1px var(--tc-venta); }
.scr-mercado .mk-msg-h { display: flex; gap: 8px; align-items: baseline; font: 10px var(--m-mono); color: var(--tc-dealer); margin-bottom: 3px; }
.scr-mercado .mk-msg.is-us .mk-msg-h { color: var(--m-ink); }
.scr-mercado .mk-msg-h b { margin-left: auto; font-size: 12px; color: var(--m-ink); }
.scr-mercado .mk-msg-t { line-height: 1.35; overflow-wrap: anywhere; }
.scr-mercado .mk-chat-f { border-top: 1px solid var(--m-line); }
.scr-mercado .mk-standing, .scr-mercado .mk-next { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; padding: 8px 12px; font-size: 12px; }
.scr-mercado .mk-standing { border-bottom: 1px solid var(--m-line); }
.scr-mercado .mk-standing.is-final { background: color-mix(in srgb, var(--tc-dealer) 12%, transparent); }
.scr-mercado .mk-standing b { font-family: var(--m-mono); }
.scr-mercado .mk-k { font: 10px var(--m-mono); letter-spacing: .08em; color: var(--m-muted); }
.scr-mercado .mk-final { font: 10px var(--m-mono); padding: 1px 5px; margin-left: 6px; background: var(--tc-dealer); color: #0b0d10; }
.scr-mercado .mk-next-t { flex: 1; min-width: 0; }
.scr-mercado .mk-src { font: 10px var(--m-mono); padding: 1px 5px; background: var(--m-s2); }

/* side */
.scr-mercado .mk-side { display: flex; flex-direction: column; gap: 8px; background: var(--m-s1); border: 1px solid var(--m-line); padding: 10px; min-width: 0; min-height: 0; overflow: auto; }
.scr-mercado .mk-seg-row { display: flex; justify-content: space-between; gap: 8px; }
.scr-mercado .mk-seg { display: inline-flex; border: 1px solid var(--m-line); }
.scr-mercado .mk-seg button, .scr-mercado .mk-btn, .scr-mercado .mk-pager button { background: transparent; color: var(--m-muted); border: 0; padding: 5px 10px; font-size: 12px; cursor: pointer; font-family: inherit; text-decoration: none; }
.scr-mercado .mk-seg button.on, .scr-mercado .mk-pager button.on { background: var(--m-s2); color: var(--m-ink); }
.scr-mercado .mk-btn { border: 1px solid var(--m-line); color: var(--m-ink); display: inline-block; }
.scr-mercado .mk-btn:hover { background: var(--m-s2); }
.scr-mercado .mk-input { background: var(--m-s2); color: var(--m-ink); border: 1px solid var(--m-line); padding: 5px 8px; font-size: 12px; font-family: inherit; }
.scr-mercado .mk-tape, .scr-mercado .mk-offs { display: flex; flex-direction: column; }
.scr-mercado .mk-tape-row, .scr-mercado .mk-off { padding: 7px 8px; border-bottom: 1px solid var(--m-line); border-left: 3px solid var(--tc); }
.scr-mercado .mk-tape-row.is-us { background: color-mix(in srgb, var(--tc) 12%, transparent); }
.scr-mercado .mk-tape-a { display: flex; gap: 8px; align-items: center; min-width: 0; font-size: 12px; }
.scr-mercado .mk-tape-a b { font: 500 12px var(--m-mono); white-space: nowrap; }
.scr-mercado .mk-tape-b { font-size: 12px; margin-top: 3px; overflow-wrap: anywhere; }
.scr-mercado .mk-sec { font: 10px var(--m-mono); letter-spacing: .08em; color: var(--m-muted); border-bottom: 1px solid var(--m-line); padding: 10px 0 4px; }

/* historial */
.scr-mercado .mk-hist { display: flex; flex-direction: column; gap: 8px; }
.scr-mercado .mk-hfilters { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; padding: 8px; background: var(--m-s1); border: 1px solid var(--m-line); }
.scr-mercado .mk-q { min-width: 180px; }
.scr-mercado .mk-table { width: 100%; border-collapse: collapse; background: var(--m-s1); font-size: 12px; }
.scr-mercado .mk-table th { text-align: left; font: 10px var(--m-mono); letter-spacing: .06em; color: var(--m-muted); padding: 6px 8px; border-bottom: 1px solid var(--m-line); text-transform: uppercase; }
.scr-mercado .mk-table td { padding: 6px 8px; border-bottom: 1px solid var(--m-line); vertical-align: top; }
.scr-mercado .mk-table tr td:first-child { border-left: 3px solid var(--tc); }
.scr-mercado .mk-table tr.is-us { background: color-mix(in srgb, var(--tc) 10%, transparent); }
.scr-mercado .mk-det { overflow-wrap: anywhere; }
.scr-mercado .mk-pager { display: flex; gap: 4px; align-items: center; }
.scr-mercado .mk-pager button { border: 1px solid var(--m-line); }
.scr-mercado .mk-pager button[disabled] { opacity: .35; cursor: default; }

@media (max-width: 999px) {
  .scr-mercado:not(.screen):not(.is-hist) { grid-template-columns: minmax(0, 1fr); height: auto; }
  .scr-mercado .mk-main, .scr-mercado .mk-side { overflow: visible; }
}
@media (max-width: 760px) { .scr-mercado .mk-chats { grid-template-columns: minmax(0, 1fr); } }
/* historial · conversaciones */
.scr-mercado .mk-conv { display: flex; flex-direction: column; gap: 8px; }
.scr-mercado .mk-conv-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; align-items: start; }
.scr-mercado .mk-conv-list > .state, .scr-mercado .mk-conv-list > .mk-more { grid-column: 1 / -1; }
.scr-mercado .mk-chat-hist .mk-msgs { max-height: 420px; overflow: auto; }
.scr-mercado .mk-chat-hist .mk-chat-f { display: none; }
.scr-mercado .mk-chat-hist.mk-st-deal .mk-status { color: var(--ok, #3ddc97); }
.scr-mercado .mk-chat-hist.mk-st-closed .mk-status { color: var(--ink-3, #6A727B); }
.scr-mercado .mk-histview { margin-right: 8px; }
@media (max-width: 1300px) { .scr-mercado .mk-conv-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .scr-mercado .mk-conv-list { grid-template-columns: minmax(0, 1fr); } }
/* duelos · historial uses these same cards (screens/duelos.js) */
.scr-mercado .mk-chat.mk-duel { border-top-color: var(--tc-duelo); cursor: pointer; }
.scr-mercado .mk-duel .mk-msg { border-left-color: var(--tc-duelo); }
.scr-mercado .mk-duel .mk-msg.is-us { border-left: 0; }
.scr-mercado .mk-duel .mk-msg-h { color: var(--tc-duelo); }
.scr-mercado .mk-duel .mk-msg.is-us .mk-msg-h { color: var(--m-ink); }
.scr-mercado .mk-duel-f { display: flex; align-items: center; gap: 8px; padding: 8px 12px; border-top: 1px solid var(--m-line); font-size: 12px; }
.scr-mercado .mk-chat-hist.mk-st-open .mk-status { color: var(--tc-duelo); background: color-mix(in srgb, var(--tc-duelo) 15%, transparent); }
.scr-duelos .dl-hist .dl-score { margin: 0; }
.scr-mercado .mk-duel .pb-nodeal { display: none; } /* the status chip already says it */
/* live grid: how each conversation stands or ended */
.scr-mercado .mk-end { border: 1px solid currentColor; padding: 0 6px; font-size: 11px; white-space: nowrap; }
.scr-mercado .mk-end.is-live { color: var(--ok); background: var(--ok-soft); }
.scr-mercado .mk-end.is-deal { color: var(--ok); }
.scr-mercado .mk-end.is-walked { color: var(--bad); }
.scr-mercado .mk-end.is-closed { color: var(--ink-3); }
.scr-mercado .mk-end-when { font-family: var(--font-num); font-size: 11px; margin-left: 6px; white-space: nowrap; }
.scr-mercado .mk-chat.is-ended { opacity: .88; }
.scr-mercado .mk-chat.is-ended .mk-chat-f { display: none; }

/* Conversaciones con equipos */
.scr-mercado .mk-teams { margin: 4px 0 18px; }
.scr-mercado .mk-dealers-h { margin-bottom: 10px; }
.scr-mercado .mk-team .mk-msgs { max-height: 220px; }
.scr-mercado .mk-teams-h h2 { margin: 0; font-size: 16px; font-weight: 600; }
.scr-mercado .mk-teams-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 10px; }
@media (max-width: 1400px) { .scr-mercado .mk-teams-list { grid-template-columns: minmax(0, 1fr); } }
.scr-mercado .mk-team { border-top-color: var(--t-cambio); }
.scr-mercado .mk-team.is-focus { outline: 2px solid var(--signal); outline-offset: -1px; }
.scr-mercado .mk-team .mk-msgs { max-height: 320px; }
.scr-mercado .mk-offer { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 6px; padding: 6px 8px; border: 1px solid var(--line-2); border-left: 3px solid var(--tc, var(--line-2)); background: var(--bg); font-size: 12.5px; }
.scr-mercado .mk-teams-list > .mk-more { grid-column: 1 / -1; text-align: center; text-decoration: none; }

/* hablar con un dealer */
.scr-mercado .mk-talk { margin-bottom: 14px; }
.scr-mercado .mk-talk-box { background: var(--m-s1); border: 1px solid var(--m-line); border-top: 2px solid var(--tc-dealer); }
.scr-mercado .mk-talk .mk-msgs { max-height: 300px; min-height: 80px; }
.scr-mercado .mk-talk-standing { border-top: 1px solid var(--m-line); }
.scr-mercado .mk-talk-val { font-family: var(--m-mono); color: var(--m-muted); }
.scr-mercado .mk-talk-gain { font-family: var(--m-mono); }
.scr-mercado .mk-talk-gain.is-up { color: var(--tc-compra); }
.scr-mercado .mk-talk-gain.is-down, .scr-mercado .mk-talk-block { color: var(--tc-venta); }
.scr-mercado .mk-talk-block { flex-basis: 100%; }
.scr-mercado .mk-talk-form { display: flex; flex-direction: column; gap: 8px; padding: 10px 12px; }
.scr-mercado .mk-talk-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.scr-mercado .mk-talk-text { width: 100%; resize: vertical; box-sizing: border-box; }
.scr-mercado .mk-talk-item { width: 220px; }
.scr-mercado .mk-talk-price { width: 150px; }
.scr-mercado .mk-talk-hint { font-size: 11px; }
.scr-mercado .mk-talk button:disabled, .scr-mercado .mk-talk .mk-input:disabled { opacity: .45; cursor: default; }
.scr-mercado .mk-talk .mk-grow { flex: 1; }