/* Departamento de Marketing: el organigrama del equipo (8-nov-2026). Todo lleva el prefijo mk- para no chocar con
   crm.css; los colores salen del CRM (oscuro) y cada área conserva el suyo: Instagram y Threads rosa, X azul y
   Edición naranja. El ancho se mide sobre la pantalla (container queries), no sobre la ventana: el menú lateral
   del CRM ocupa sitio. */
#s-marketing { container-type:inline-size; }
.mk {
  --mk-papel:var(--bg); --mk-rejilla:rgba(255,255,255,.035); --mk-sup:var(--card); --mk-tinta:var(--text);
  --mk-suave:var(--muted); --mk-linea:#5b5f6e; --mk-fino:var(--border);
  --mk-ig:#EC6FA2; --mk-ig-s:#36172A; --mk-ig-t:#F6B0CC;
  --mk-x:#7E9EF7; --mk-x-s:#172240; --mk-x-t:#BCCBFA;
  --mk-ed:#F0A04A; --mk-ed-s:#33230F; --mk-ed-t:#F8CB93;
  --mk-tg:#4FC1D6; --mk-tg-s:#0F2A31; --mk-tg-t:#A7E3EE;
  --mk-sobre:#0D1219;
  --mk-mono:ui-monospace,'JetBrains Mono',Consolas,monospace;
  color:var(--mk-tinta); font-size:15px; line-height:1.5;
}
.mk *, .mk *::before, .mk *::after { box-sizing:border-box; }
.mk h2, .mk h3 { margin:0; line-height:1.15; text-wrap:balance; }
.mk h2 { font-size:clamp(1.4rem,3cqi,1.9rem); font-weight:800; letter-spacing:-.01em; }
.mk h3 { font-size:1.04rem; font-weight:700; }
.mk p { margin:0; }
.mk button { font:inherit; }

/* Color por área */
.mk-ig { --c:var(--mk-ig); --c-s:var(--mk-ig-s); --c-t:var(--mk-ig-t); }
.mk-x { --c:var(--mk-x); --c-s:var(--mk-x-s); --c-t:var(--mk-x-t); }
.mk-ed { --c:var(--mk-ed); --c-s:var(--mk-ed-s); --c-t:var(--mk-ed-t); }
.mk-tg { --c:var(--mk-tg); --c-s:var(--mk-tg-s); --c-t:var(--mk-tg-t); }
.mk-n { --c:var(--mk-tinta); --c-s:var(--card2); --c-t:var(--mk-tinta); }

.mk-etq { font-family:var(--mk-mono); font-size:.69rem; letter-spacing:.09em; text-transform:uppercase; color:var(--mk-suave); font-weight:500; margin:0; }
.mk-lead { font-size:1.04rem; max-width:62ch; color:var(--mk-suave); }

/* Cabecera: datos y saltos a cada parte */
.mk-cab { display:flex; flex-direction:column; gap:14px; margin-bottom:18px; }
.mk-datos { display:flex; flex-wrap:wrap; gap:6px 28px; margin:2px 0 0; }
.mk-datos div { display:flex; align-items:baseline; gap:8px; }
.mk-datos dt { order:2; color:var(--mk-suave); font-size:.92rem; }
.mk-datos dd { margin:0; font-weight:800; font-size:1.45rem; font-variant-numeric:tabular-nums; }
.mk-leyenda { display:flex; flex-wrap:wrap; gap:8px; }
.mk-lg { display:inline-flex; align-items:center; gap:8px; padding:6px 12px; border-radius:8px; border:1.5px solid var(--mk-fino); background:var(--mk-sup); color:var(--mk-tinta); font-weight:600; font-size:.88rem; cursor:pointer; }
.mk-lg:hover { border-color:var(--mk-linea); }
.mk-sw { width:12px; height:12px; border-radius:3px; background:var(--c); }
.mk-lg-sep { width:1px; align-self:stretch; background:var(--mk-fino); margin:0 4px; }

/* Barra «Ver por persona» */
.mk-barra { position:sticky; top:0; z-index:5; background:var(--mk-papel); border-block:1px solid var(--mk-fino); margin:0 0 6px; }
.mk-barra-in { display:flex; align-items:center; gap:8px 14px; padding-block:10px; flex-wrap:wrap; }
.mk-filtros { display:flex; gap:6px; overflow-x:auto; min-width:0; flex:1 1 0; scrollbar-width:none; }
.mk-filtros::-webkit-scrollbar { display:none; }
.mk-f { font-size:.86rem; font-weight:600; display:inline-flex; align-items:center; gap:8px; padding:6px 12px; border-radius:999px; border:1.5px solid var(--mk-fino); background:var(--mk-sup); color:var(--mk-tinta); cursor:pointer; white-space:nowrap; flex:none; }
.mk-f:hover { border-color:var(--mk-linea); }
.mk-f[aria-pressed="true"] { background:var(--mk-tinta); color:var(--mk-papel); border-color:var(--mk-tinta); }
.mk-puntos { display:inline-flex; gap:3px; }
.mk-puntos i { width:8px; height:8px; border-radius:50%; background:var(--c); }
.mk-nota-filtro { flex-basis:100%; font-size:.9rem; }

/* Lienzo cuadriculado, como la pizarra original */
.mk-lienzo { display:flex; flex-direction:column; gap:64px; padding:34px 22px 40px; border-radius:18px;
  background-color:var(--mk-papel); background-image:linear-gradient(var(--mk-rejilla) 1px,transparent 1px),linear-gradient(90deg,var(--mk-rejilla) 1px,transparent 1px);
  background-size:28px 28px; border:1px solid var(--mk-fino); }
.mk-sec { scroll-margin-top:70px; }
.mk-sec-cab { display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:8px 24px; padding-bottom:14px; border-bottom:2px solid var(--c); margin-bottom:28px; }
.mk-sec-titulo { display:flex; align-items:center; gap:12px; }
.mk-sec-clave { width:18px; height:18px; border-radius:4px; background:var(--c); flex:none; }
.mk-sec-meta { font-family:var(--mk-mono); font-size:.8rem; color:var(--mk-suave); }
.mk-sec-lead { color:var(--mk-suave); max-width:64ch; margin:-12px 0 24px; }

/* Árbol */
.mk-arbol { display:flex; flex-direction:column; align-items:center; }
.mk-vl { width:2px; height:28px; background:var(--mk-linea); position:relative; flex:none; margin:0 auto; }
.mk-vl::after { content:""; position:absolute; bottom:0; left:50%; transform:translateX(-50%); border-left:5px solid transparent; border-right:5px solid transparent; border-top:7px solid var(--mk-linea); }
.mk-vl.mk-liso::after { display:none; }
.mk-rama { --gap:20px; --n:3; width:100%; display:grid; grid-template-columns:repeat(var(--n),minmax(0,1fr)); gap:var(--gap); position:relative; padding-top:28px; align-items:start; }
.mk-rama::before { content:""; position:absolute; top:0; height:2px; background:var(--mk-linea);
  left:calc((100% - (var(--n) - 1) * var(--gap)) / var(--n) / 2); right:calc((100% - (var(--n) - 1) * var(--gap)) / var(--n) / 2); }
.mk-rama-2 { --n:2; max-width:880px; }
.mk-rama-4 { --n:4; --gap:16px; }
.mk-solo { width:100%; max-width:560px; display:flex; flex-direction:column; align-items:center; }
.mk-solo > *:not(.mk-vl) { width:100%; }
.mk-hoja { position:relative; display:flex; flex-direction:column; align-items:center; min-width:0; }
.mk-hoja::before { content:""; position:absolute; top:-28px; left:50%; width:2px; height:28px; background:var(--mk-linea); transform:translateX(-50%); }
.mk-hoja::after { content:""; position:absolute; top:-7px; left:50%; transform:translateX(-50%); border-left:5px solid transparent; border-right:5px solid transparent; border-top:7px solid var(--mk-linea); }
.mk-hoja > *:not(.mk-vl) { width:100%; }

.mk-nodo { border-radius:10px; text-align:center; }
.mk-nodo strong { display:block; font-weight:800; }
.mk-raiz { background:var(--mk-tinta); color:var(--mk-papel); padding:16px 34px; }
.mk-raiz .mk-etq { color:inherit; opacity:.72; }
.mk-raiz strong { font-size:1.3rem; }
.mk-depto { background:var(--c); color:var(--mk-sobre); padding:14px 34px; }
.mk-depto .mk-etq { color:inherit; opacity:.85; }
.mk-depto strong { font-size:1.2rem; }
.mk-resp { background:var(--mk-sup); border:2px solid var(--c); padding:12px 18px; max-width:600px; }
.mk-resp .mk-chips { justify-content:center; margin-top:8px; }
.mk-lider { background:var(--mk-sup); border:2px solid var(--mk-tinta); padding:12px 28px; transition:opacity .2s; }
.mk-lider strong { font-size:1.15rem; }
.mk-lider span { display:block; color:var(--mk-suave); font-size:.88rem; margin-top:2px; }

/* Chips de persona */
.mk-chips { display:flex; flex-wrap:wrap; gap:6px; }
.mk-chip { display:inline-flex; align-items:center; gap:6px; padding:3px 10px 3px 3px; border-radius:999px; background:var(--c-s); font-size:.86rem; font-weight:600; color:var(--mk-tinta); transition:opacity .2s; }
.mk-chip i { font-style:normal; width:22px; height:22px; border-radius:50%; background:var(--c); color:var(--mk-sobre); display:grid; place-items:center; font-size:.6rem; font-weight:700; letter-spacing:.02em; }
.mk-chip em { font-style:normal; font-weight:500; color:var(--mk-suave); }

/* Tarjetas del mapa general (botones: bajan hasta el área) */
.mk-ov { display:flex; flex-direction:column; width:100%; padding:0; background:var(--mk-sup); border:1.5px solid var(--mk-fino); border-radius:10px; overflow:hidden; color:var(--mk-tinta); text-align:left; cursor:pointer; transition:border-color .15s,transform .15s,opacity .2s; }
.mk-ov:hover { border-color:var(--c); transform:translateY(-2px); }
.mk-ov-cab { display:block; background:var(--c); color:var(--mk-sobre); padding:12px 16px; }
.mk-ov-cab .mk-etq { display:block; color:inherit; opacity:.85; }
.mk-ov-cab strong { font-size:1.12rem; font-weight:800; display:block; }
.mk-ov-cuerpo { padding:14px 16px 16px; display:flex; flex-direction:column; gap:12px; }
.mk-ov-ir { font-weight:600; color:var(--c-t); font-size:.88rem; }

/* Tarjeta de persona */
.mk-persona { background:var(--mk-sup); border:1.5px solid var(--mk-fino); border-radius:10px; overflow:hidden; text-align:left; transition:opacity .2s,box-shadow .2s,border-color .2s; }
.mk-persona-cab { background:var(--c-s); padding:13px 16px; display:flex; gap:12px; align-items:center; }
.mk-avatar { width:40px; height:40px; border-radius:50%; background:var(--c); color:var(--mk-sobre); display:grid; place-items:center; font-weight:800; font-size:.85rem; flex:none; letter-spacing:.02em; }
.mk-persona-id { min-width:0; flex:1; }
.mk-rol { font-size:.86rem; color:var(--c-t); font-weight:600; line-height:1.3; margin-top:2px; }
.mk-insignia { flex:none; font-family:var(--mk-mono); font-size:.62rem; text-transform:uppercase; letter-spacing:.07em; border:1.5px solid var(--c-t); color:var(--c-t); padding:2px 7px; border-radius:999px; align-self:flex-start; }
.mk-persona-cuerpo { padding:14px 16px 16px; display:flex; flex-direction:column; gap:12px; }
.mk-tareas { margin:6px 0 0; padding:0; list-style:none; display:grid; gap:6px; }
.mk-tareas li { padding-left:18px; position:relative; line-height:1.45; }
.mk-tareas li::before { content:""; position:absolute; left:2px; top:.52em; width:7px; height:7px; border-radius:2px; background:var(--c); }
.mk-objetivo { background:var(--c-s); border-radius:8px; padding:8px 10px; font-weight:600; font-size:.92rem; }
.mk-objetivo .mk-etq { display:block; color:var(--c-t); margin-bottom:2px; }
.mk-ejemplo { border:1.5px dashed var(--c); border-radius:8px; padding:10px 12px; font-size:.93rem; }
.mk-ejemplo .mk-etq { color:var(--c-t); margin-bottom:3px; }
.mk-ejemplo b { font-weight:700; color:var(--c-t); }

/* Dispositivos y herramientas */
.mk-herr { background:var(--mk-sup); border:1.5px dashed var(--mk-linea); border-radius:10px; padding:12px 14px; text-align:left; transition:opacity .2s; }
.mk-herr .mk-etq { margin-bottom:8px; }
.mk-disp { display:grid; grid-template-columns:auto minmax(0,1fr); gap:7px 12px; align-items:center; }
.mk-disp-modelo { font-weight:600; font-size:.9rem; }
.mk-disp-chips { display:flex; gap:6px; flex-wrap:wrap; }
.mk-dev { font-family:var(--mk-mono); font-size:.76rem; padding:3px 8px; border-radius:5px; background:var(--c-s); color:var(--c-t); white-space:nowrap; }
.mk-lista-herr { display:flex; flex-wrap:wrap; gap:6px; }
.mk-herr-total { margin-top:10px; font-size:.84rem; color:var(--mk-suave); }

/* Nota del equipo */
.mk-aviso { margin-top:26px; width:100%; display:flex; gap:14px; align-items:flex-start; background:var(--mk-sup); border:1.5px dashed var(--mk-linea); border-radius:10px; padding:14px 16px; text-align:left; }
.mk-aviso-ico { flex:none; width:36px; height:36px; border-radius:50%; background:var(--c-s); color:var(--c-t); display:grid; place-items:center; }
.mk-aviso h3 { margin-bottom:2px; }
.mk-aviso p { color:var(--mk-suave); }

/* Flujo del contenido */
.mk-flujo { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; }
.mk-paso { display:grid; grid-template-columns:48px minmax(0,1.15fr) minmax(0,1fr); gap:0 22px; position:relative; padding-bottom:26px; transition:opacity .2s; }
.mk-paso::before { content:""; position:absolute; left:23px; top:48px; bottom:0; width:2px; background:var(--mk-linea); }
.mk-paso-num { width:48px; height:48px; border-radius:50%; background:var(--mk-sup); border:2px solid var(--mk-tinta); display:grid; place-items:center; font-weight:800; font-size:1.1rem; font-variant-numeric:tabular-nums; position:relative; z-index:1; }
.mk-paso-main { padding-top:4px; display:flex; flex-direction:column; gap:8px; min-width:0; }
.mk-paso-ej { background:var(--mk-sup); border:1.5px dashed var(--mk-linea); border-radius:10px; padding:10px 12px; align-self:start; font-size:.93rem; min-width:0; }
.mk-paso-ej .mk-etq { margin-bottom:3px; }
.mk-canales { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.mk-canal { border-radius:8px; padding:8px 10px; background:var(--c-s); border:1.5px solid var(--c); font-size:.84rem; line-height:1.35; }
.mk-canal strong { display:block; color:var(--c-t); font-size:.86rem; }
.mk-embudo { display:flex; flex-wrap:wrap; align-items:center; gap:6px; }
.mk-fn { padding:4px 10px; border-radius:8px; font-weight:700; font-size:.85rem; background:var(--c-s); color:var(--c-t); border:1.5px solid var(--c); }
.mk-fn-tg { background:var(--mk-tinta); color:var(--mk-papel); border-color:var(--mk-tinta); }
.mk-fn-flecha { color:var(--mk-suave); font-weight:700; padding:0 2px; }
.mk-ciclo { display:flex; align-items:center; gap:14px; padding:12px 16px 12px 0; }
.mk-ciclo-ico { width:48px; height:48px; border-radius:50%; border:2px dashed var(--mk-linea); display:grid; place-items:center; color:var(--mk-suave); flex:none; background:var(--mk-sup); }
.mk-ciclo p { font-weight:600; }

/* Tablas */
.mk-tabla-caja { overflow-x:auto; border:1.5px solid var(--mk-fino); border-radius:10px; background:var(--mk-sup); }
.mk-tabla { border-collapse:collapse; width:100%; min-width:660px; }
.mk-tabla th, .mk-tabla td { padding:12px 14px; text-align:left; vertical-align:top; border-bottom:1px solid var(--mk-fino); }
.mk-tabla thead th { font-family:var(--mk-mono); font-size:.7rem; letter-spacing:.07em; text-transform:uppercase; color:var(--mk-suave); background:var(--card2); font-weight:500; white-space:nowrap; }
.mk-tabla thead th .mk-sw { display:inline-block; width:10px; height:10px; margin-right:6px; vertical-align:-1px; }
.mk-tabla tbody th { font-weight:700; white-space:nowrap; }
.mk-tabla tbody th small { display:block; font-weight:500; color:var(--mk-suave); font-size:.78rem; }
.mk-tabla tbody tr:last-child th, .mk-tabla tbody tr:last-child td { border-bottom:0; }
.mk-tabla tbody tr { transition:opacity .2s; }
.mk-tabla tfoot th, .mk-tabla tfoot td { border-top:2px solid var(--mk-fino); border-bottom:0; font-size:.88rem; color:var(--mk-suave); font-weight:600; background:var(--card2); }
.mk-celda { display:inline-block; padding:4px 10px; border-radius:8px; background:var(--c-s); color:var(--c-t); font-weight:600; font-size:.88rem; line-height:1.35; }
.mk-vacio { color:var(--mk-linea); font-weight:600; }
.mk-tabla td b, .mk-tabla tfoot b { font-weight:800; color:var(--mk-tinta); }

/* Cuentas por modelo: de quién es cada cuenta y cómo se lleva */
.mk-cuentas { width:100%; margin-top:34px; text-align:left; }
.mk-cuentas-cab { display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:10px 20px; margin-bottom:12px; }
.mk-modos { display:flex; flex-wrap:wrap; gap:6px 14px; font-size:.82rem; color:var(--mk-suave); }
.mk-modos > span { display:inline-flex; align-items:center; gap:6px; }
.mk-tabla-cuentas { min-width:600px; }
.mk-tabla-cuentas th, .mk-tabla-cuentas td { padding:8px 12px; vertical-align:middle; }
.mk-tabla-cuentas tbody th { font-weight:600; }
.mk-grupo th { background:var(--card2); border-top:1px solid var(--mk-fino); font-size:1rem; font-weight:800; padding-top:10px; padding-bottom:10px; }
.mk-tabla .mk-grupo th small { margin-top:1px; font-weight:500; color:var(--mk-suave); font-size:.8rem; }
.mk-tabla-cuentas tbody:first-of-type .mk-grupo th { border-top:0; }
.mk-tabla-cuentas tbody tr:last-child th, .mk-tabla-cuentas tbody tr:last-child td { border-bottom:0; }
.mk-handle { font-family:var(--mk-mono); font-size:.84rem; }
.mk-nueva { color:var(--mk-suave); font-style:italic; font-weight:500; }
.mk-log { margin-left:8px; font-family:var(--mk-mono); font-size:.6rem; text-transform:uppercase; letter-spacing:.06em; color:#9FD8B5; border:1px solid #3E7A57; border-radius:999px; padding:1px 6px; vertical-align:1px; }
.mk-red { display:flex; flex-wrap:wrap; align-items:center; gap:6px; }
.mk-red .mk-chip { font-size:.78rem; padding:2px 8px 2px 2px; }
.mk-red .mk-chip i { width:18px; height:18px; font-size:.52rem; }
.mk-modo { display:inline-block; font-family:var(--mk-mono); font-size:.7rem; font-weight:600; padding:2px 7px; border-radius:5px; border:1.5px solid; white-space:nowrap; }
.mk-modo-metricool { color:#9FD8B5; border-color:#3E7A57; background:#13261B; }
.mk-modo-manual { color:#F2D48A; border-color:#7A6630; background:#2A2310; }
.mk-modo-adspower { color:var(--mk-x-t); border-color:var(--mk-x); background:var(--mk-x-s); }
.mk-modo-baneada { color:#F59A9A; border-color:#7A3434; background:#2A1212; }
.mk-modo-crear { color:var(--mk-suave); border-style:dashed; border-color:var(--mk-linea); background:transparent; }

/* Herramientas */
.mk-herrs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-bottom:22px; }
.mk-herr-card { background:var(--mk-sup); border:1.5px solid var(--mk-fino); border-top:4px solid var(--c); border-radius:10px; padding:14px 16px; display:flex; flex-direction:column; gap:8px; transition:opacity .2s; }
.mk-herr-card > p:not(.mk-etq):not(.mk-herr-total) { color:var(--mk-suave); font-size:.92rem; }
.mk-herr-card .mk-herr-total { margin-top:auto; }

/* Reglas */
.mk-reglas { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.mk-regla { background:var(--mk-sup); border:1.5px solid var(--mk-fino); border-radius:10px; padding:16px 18px; display:flex; flex-direction:column; gap:4px; }
.mk-regla p { color:var(--mk-suave); }
.mk-pie { color:var(--mk-suave); font-size:.85rem; margin-top:18px; }

/* Filtro por persona: lo demás se apaga */
.mk-filtrando [data-mk-personas]:not(.mk-si) { opacity:.2; }
.mk-filtrando .mk-persona.mk-si, .mk-filtrando .mk-ov.mk-si { border-color:var(--c); box-shadow:0 0 0 2px var(--c); }

/* Pantalla estrecha: el árbol pasa a una línea vertical a la izquierda */
@container (max-width:880px) {
  .mk-arbol { align-items:stretch; }
  .mk-arbol > .mk-vl { margin:0 0 0 23px; }
  .mk-rama, .mk-rama-2 { display:flex; flex-direction:column; gap:18px; padding-top:0; padding-left:44px; max-width:none; }
  .mk-rama::before { display:none; }
  .mk-hoja { align-items:stretch; }
  .mk-hoja::before { top:30px; left:-21px; width:21px; height:2px; transform:none; }
  .mk-hoja::after { top:-18px; left:-21px; width:2px; height:50px; border:0; background:var(--mk-linea); transform:none; }
  .mk-hoja:first-child::after { top:0; height:32px; }
  .mk-paso { grid-template-columns:40px minmax(0,1fr); gap:0 16px; }
  .mk-paso::before { left:19px; top:40px; }
  .mk-paso-num { width:40px; height:40px; font-size:1rem; }
  .mk-paso-ej { grid-column:2; margin-top:10px; }
  .mk-ciclo-ico { width:40px; height:40px; }
  .mk-lienzo { padding:26px 14px 30px; gap:52px; }
}
@container (max-width:880px) {
  .mk-herrs { grid-template-columns:1fr; }
}
@container (max-width:640px) {
  .mk-canales, .mk-reglas { grid-template-columns:1fr; }
  .mk-barra .mk-etq, .mk-lg-sep { display:none; }
}
@media (prefers-reduced-motion:reduce) {
  .mk *, .mk *::before, .mk *::after { transition:none !important; }
}
