/* ============================================================
   MARKET — inteligencia breve, no feed

   La hoja usa los tokens existentes y deja que el espacio establezca
   la jerarquía. Solo el estado principal y los datos medidos reciben
   una superficie; el resto se lee como una secuencia editorial.
   ============================================================ */
/* .mk-view ya no fija su propio max-width: lo hereda de `main` (ver
   `main:has(#view-market.active)` en dashboard-v2.css) — dos anchos
   máximos anidados (1180px en main, 1120px aquí) eran la misma decisión
   escrita dos veces. .mk2-view neutraliza cualquier límite propio. */
.mk-view{padding-bottom:var(--space-9);}
/* .mk-header/.mk-eyebrow/.mk-subtitle/.mk-header-actions/.mk-updated/
   .mk-refresh y el bloque .mk-status completo (más abajo) quedaron
   muertos cuando la cabecera pasó a usar .mk2-header/.mk2-eyebrow/
   .mk2-title/.mk2-subtitle/.mk2-updated/.mk2-refresh — ningún elemento
   del markup real los usa ya (verificado por grep). Se retiraron en vez
   de dejarlos como ruido que alguien podría volver a enganchar sin
   querer. */

.mk-loading{display:grid;gap:12px;max-width:760px;padding:var(--space-5) 0;}
#mkLoading[hidden],#mkContent[hidden],#mkEmpty[hidden]{display:none !important;}
.mk-skeleton{display:block;width:72%;height:15px;border-radius:var(--r-2xs);background:linear-gradient(90deg,var(--surface2) 25%,var(--surface3) 50%,var(--surface2) 75%);background-size:250% 100%;animation:mkShimmer 1.5s ease-in-out infinite;}
.mk-skeleton-lg{width:54%;height:32px;}.mk-skeleton-short{width:38%;}
@keyframes mkShimmer{0%{background-position:-120% 0;}100%{background-position:120% 0;}}

.mk-status-copy{min-width:0;flex:1;}
.mk-status h3{margin:7px 0 7px;font-family:var(--font-display);font-size:clamp(22px,3vw,32px);line-height:1.18;letter-spacing:-.02em;font-weight:700;color:var(--text);}
.mk-status-note{margin:0;color:var(--muted);font-size:var(--text-body-sm-size);line-height:1.5;}
.mk-status-evidence{margin-top:12px;color:var(--text);font-size:var(--text-caption-size);line-height:1.5;}
.mk-status-change{margin:12px 0 0;padding-top:12px;border-top:1px solid var(--border-soft);color:var(--text);font-size:var(--text-body-sm-size);line-height:1.45;}
.mk-status-source{display:block;margin-top:12px;color:var(--muted2);font-size:var(--text-caption-size);}
.mk-status-badge{display:inline-flex;align-items:center;gap:7px;flex:0 0 auto;padding:6px 10px;border:1px solid var(--border-soft);border-radius:var(--r-pill);font-size:var(--text-caption-size);color:var(--muted);white-space:nowrap;}
.mk-status-dot{width:7px;height:7px;border-radius:50%;background:var(--green);}

/* .mk-section/.mk-section-head/.mk-section-note quedaron muertas: cada
   sección del markup real ya trae mk2-panel/mk2-section-head (con
   márgenes en 0), y ningún HTML/JS las usa solas — igual que
   .mk-pulse-grid/.mk-pulse-item y .mk-main-grid, cuya única función hoy
   es competir con .mk2-pulse-grid/.mk2-pulse-item/.mk2-main-grid por el
   layout de los mismos elementos con OTRO juego de breakpoints (900/560
   aquí, 900/640 en dashboard-v2.css). Ese doble sistema — no la falta de
   una media query — era la causa real de que Market se viera grande y
   poco responsive en móvil. dashboard-v2.css es ahora el único dueño de
   ese layout; aquí solo queda el estilo de contenido que no toca. */
.mk-driver-list{display:grid;gap:0;border-top:1px solid var(--border);}
.mk-driver{padding:16px 0;border-bottom:1px solid var(--border-soft);}
.mk-driver-head{display:flex;align-items:center;gap:8px;margin-bottom:8px;}
.mk-label{display:inline-flex;align-items:center;padding:3px 7px;border:1px solid var(--border);border-radius:var(--r-2xs);font-size:10px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);}
.mk-label-fact{color:var(--text);border-color:var(--text-dim);}.mk-label-observation{color:var(--muted);}.mk-label-possible_impact{border-style:dashed;}
.mk-driver-type{font-family:var(--font-mono);font-size:10px;color:var(--muted2);}
.mk-driver h4,.mk-observation h4{margin:0;font-size:var(--text-body-size);font-weight:650;line-height:1.4;color:var(--text);}
.mk-why{margin:7px 0 0;padding-left:10px;border-left:1px solid var(--border);font-size:var(--text-body-sm-size);line-height:1.5;color:var(--muted);}
.mk-why b{font-weight:650;color:var(--text);}
.mk-evidence{margin:8px 0 0;font-size:var(--text-caption-size);line-height:1.45;color:var(--muted2);}

.mk-context-summary{padding:18px;background:var(--surface2);border:1px solid var(--border-soft);border-radius:var(--r-md);}
.mk-context-summary > p{margin:0 0 16px;font-size:var(--text-body-size);line-height:1.45;font-weight:600;color:var(--text);}
.mk-dimension-list{display:grid;gap:0;border-top:1px solid var(--border-soft);}
.mk-dimension{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding:10px 0;border-bottom:1px solid var(--border-soft);}
.mk-dimension span{font-size:var(--text-caption-size);color:var(--muted);}.mk-dimension strong{font-family:var(--font-mono);font-size:var(--text-caption-size);color:var(--text);text-align:right;}
.mk-missing{margin:14px 0 0;color:var(--muted2);font-size:var(--text-caption-size);line-height:1.45;}

.mk-observation-list{display:grid;gap:12px;margin-bottom:14px;}
.mk-observation{padding:16px 18px;border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface);}
.mk-observation h4{margin-top:9px;font-size:var(--text-h4-size);}
.mk-fact-list{border-top:1px solid var(--border);}
.mk-fact-row{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:11px 0;border-bottom:1px solid var(--border-soft);font-size:var(--text-body-sm-size);line-height:1.4;color:var(--text);}
.mk-fact-source{font-size:var(--text-caption-size);color:var(--muted2);white-space:nowrap;text-align:right;}

.mk-coming-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;}
.mk-coming-group{padding:15px 16px;border:1px solid var(--border-soft);border-radius:var(--r-md);background:var(--surface);}
.mk-coming-group h4{margin:0 0 10px;font-family:var(--font-mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted2);}
.mk-coming-row{display:grid;gap:5px;padding-top:10px;border-top:1px solid var(--border-soft);}.mk-coming-row:first-of-type{padding-top:0;border-top:0;}
.mk-coming-row strong{font-size:var(--text-body-sm-size);line-height:1.4;color:var(--text);}.mk-coming-row span{font-size:var(--text-caption-size);line-height:1.4;color:var(--muted2);}

.mk-sources{padding-top:var(--space-6);border-top:1px solid var(--border);}
.mk-source-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;}
.mk-source-row{padding:14px 15px;border:1px solid var(--border-soft);border-radius:var(--r-md);background:var(--surface2);}
.mk-source-row p{margin:0 0 10px;font-size:var(--text-body-sm-size);font-weight:600;line-height:1.4;color:var(--text);}
.mk-source-row span{font-size:var(--text-caption-size);color:var(--muted2);}
.mk-inline-empty,.mk-empty{display:grid;gap:5px;padding:16px 18px;border:1px dashed var(--border);border-radius:var(--r-md);background:var(--surface2);}
.mk-inline-empty strong,.mk-empty strong{font-size:var(--text-body-sm-size);font-weight:650;color:var(--text);}.mk-inline-empty span,.mk-empty span{font-size:var(--text-caption-size);line-height:1.45;color:var(--muted);}
.mk-inline-empty.has-icon{display:flex;align-items:flex-start;gap:12px;}
.mk-inline-empty.has-icon>div{display:grid;gap:5px;}
.mk-inline-empty-ic{display:grid;flex:0 0 32px;width:32px;height:32px;place-items:center;border-radius:50%;background:var(--surface);color:var(--muted2);}
.mk-inline-empty-ic svg{width:17px;height:17px;}
.mk-empty{margin-top:var(--space-5);max-width:680px;}

/* Un solo breakpoint (640px), el mismo que ya usa dashboard-v2.css para
   el resto de Market — antes este archivo cortaba en 900/560, un juego
   de cortes propio que no coincidía con el de las clases mk2-* que
   comparten los mismos elementos. */
@media (max-width:900px){
  .mk-coming-list,.mk-source-list{grid-template-columns:1fr 1fr;}
}
@media (max-width:640px){
  .mk-section-head{align-items:flex-start;flex-direction:column;gap:3px;}.mk-section-note{white-space:normal;}.mk-fact-row{display:grid;gap:5px;}.mk-fact-source{text-align:left;white-space:normal;}.mk-coming-list,.mk-source-list{grid-template-columns:1fr;}
}
@media (prefers-reduced-motion:reduce){.mk-skeleton{animation:none;}}

/* El viejo "command center" (.cmd-*) ya no lo genera ningún JS —
   command.js lo reemplazó por el bloque d2-* del Panel — así que todo
   ese bloque quedó muerto. Se retira; solo queda .mk-watch-*, que sí
   sigue usando watchHtml() en market/ui.js. */
.mk-watch-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;border-top:1px solid var(--border-soft);}
.mk-watch-row{display:grid;grid-template-columns:minmax(115px,.7fr) minmax(0,1.5fr) auto;align-items:start;gap:16px;padding:15px 0;border-bottom:1px solid var(--border-soft);}
.mk-watch-row:nth-child(odd){padding-right:20px;border-right:1px solid var(--border-soft);}.mk-watch-row:nth-child(even){padding-left:20px;}
.mk-watch-row > div{min-width:0;}.mk-watch-row strong{display:block;color:var(--text);font-size:var(--text-body-sm-size);}.mk-watch-row > div > span{display:block;margin-top:4px;color:var(--muted2);font-size:var(--text-caption-size);line-height:1.35;}
.mk-watch-row p{margin:0;color:var(--muted);font-size:var(--text-caption-size);line-height:1.45;}.mk-watch-row p b{color:var(--text);font-weight:650;}.mk-watch-row small{color:var(--muted2);font-size:10px;line-height:1.4;text-align:right;white-space:nowrap;}.mk-watch-row.is-up strong{color:var(--green);}.mk-watch-row.is-down strong{color:var(--red);}
@media(max-width:640px){
  .mk-watch-list{grid-template-columns:1fr;}.mk-watch-row,.mk-watch-row:nth-child(odd),.mk-watch-row:nth-child(even){grid-template-columns:minmax(0,1fr) auto;gap:8px 12px;padding:13px 0;border-right:0;}.mk-watch-row p{grid-column:1/-1;}.mk-watch-row small{grid-column:2;grid-row:1;text-align:right;}
}