/* ═══════════════════════════════════════════════════════════════════════
   Integración v1.1.27 (Claude) — puente entre rediseno.css (ChatGPT) y el
   DOM/styles.css reales de v1.1.26. Solo CSS: no cambia lógica ni IDs.
   Prefijo body.ministeros-integrated → gana a styles.css (ids) sin !important,
   salvo donde game.js pone estilos inline.
   Las pantallas fuera de la tablet (config, intro, fin, tutorial, desbloqueo)
   conservan su estética original a propósito.
   ═══════════════════════════════════════════════════════════════════════ */

/* ── 0 · Base ─────────────────────────────────────────────────────────── */
body.ministeros-integrated {
  overflow: hidden;
  background: var(--mo-stage);
}
body.ministeros-integrated #ministeros-shell {
  color: var(--mo-ink);
  font-family: var(--mo-font);
  line-height: 1.35;
}

/* ── 1 · Cabecera: saludo, estado, mes y avisos ───────────────────────── */
body.ministeros-integrated .mo-homehead h1 { font-family: var(--mo-font); }
body.ministeros-integrated #header-nombre-ministro {
  margin-top: 1px;
  color: var(--mo-ink-soft) !important;
  font-size: 13px;
  font-weight: 600 !important;
  letter-spacing: 0;
}
body.ministeros-integrated #estado-juego {
  margin: 4px 0 0;
  padding: 0;
  border: 0;
  background: none;
  box-shadow: none;
  text-align: left;
}
body.ministeros-integrated #estado-titulo {
  margin: 0;
  color: var(--mo-ink-soft);
  font-family: var(--mo-font);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
}
body.ministeros-integrated #estado-msg {
  color: var(--mo-ink);
  font-family: var(--mo-font);
  font-size: 12px;
  line-height: 1.35;
}
body.ministeros-integrated #estado-msg b,
body.ministeros-integrated #estado-msg span { color: inherit !important; }

body.ministeros-integrated .mo-turn {
  flex-direction: column;
  align-items: flex-end;
  gap: 6px;
}
body.ministeros-integrated .mo-turn > span { white-space: nowrap; font-size: 13px; }
body.ministeros-integrated #turno-num {
  display: inline;
  margin: 0;
  color: var(--mo-ink);
  font: inherit;
  font-size: 13px;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  letter-spacing: 0;
  text-shadow: none;
}
body.ministeros-integrated #ministeros-alert-host {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
  max-width: 560px;
}
/* game.js pinta estos avisos con estilos inline → !important solo aquí */
body.ministeros-integrated #reloj-mes-aviso,
body.ministeros-integrated #ministeros-alert-host > [id$="-aviso"] {
  margin: 0 !important;
  padding: 4px 11px !important;
  border: 1px solid var(--mo-hairline) !important;
  border-radius: 999px !important;
  background: var(--mo-surface) !important;
  box-shadow: var(--mo-card-shadow);
  color: var(--mo-ink-soft);
  font-family: var(--mo-font) !important;
  font-size: 11px !important;
  font-weight: 500;
  letter-spacing: 0 !important;
  line-height: 1.35 !important;
  text-transform: none !important;
  white-space: nowrap;
  animation: none !important;
}
body.ministeros-integrated #reloj-mes-aviso { border-color: rgba(189, 124, 10, 0.45) !important; background: var(--mo-amber-soft) !important; color: #7a5208; }
body.ministeros-integrated #reloj-mes-aviso b { color: #7a5208; }
body.ministeros-integrated #ministeros-alert-host [class$="-icon"],
body.ministeros-integrated #ministeros-alert-host [class$="-info"] { font-size: inherit; color: inherit; }

/* ── 2 · Widget de recursos (el host YA es la tarjeta) ────────────────── */
body.ministeros-integrated #ministeros-resource-host {
  grid-template-columns: minmax(0, 5fr) minmax(170px, 1.35fr);
  min-height: 0;
}
body.ministeros-integrated #recursos {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0;
  min-height: 0;
  margin: 0;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  backdrop-filter: none;
}
body.ministeros-integrated #recursos .recurso-card {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2px;
  padding: 11px 14px;
  border: 0;
  border-right: 1px solid var(--mo-hairline);
  border-radius: 0;
  background: none;
  text-align: left;
}
body.ministeros-integrated #recursos .recurso-label {
  margin: 0;
  color: var(--mo-ink-soft) !important;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
}
body.ministeros-integrated #recursos .recurso-val {
  margin: 0;
  color: var(--mo-ink);
  font-size: 22px;
  font-weight: 700;
  line-height: 1.1;
  text-shadow: none;
}
body.ministeros-integrated #cloaca-riesgo {
  width: 100%;
  height: 4px;
  margin-top: 4px;
  border-radius: 999px;
  background: var(--mo-gray-soft);
}
body.ministeros-integrated #cloaca-riesgo-texto {
  margin: 1px 0 0;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0;
}
body.ministeros-integrated #escandalo-wrap {
  display: grid;
  align-content: center;
  gap: 8px;
  margin: 0;
  padding: 11px 16px;
  border: 0;
  border-radius: 0;
  background: none;
}
body.ministeros-integrated #escandalo-label {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  color: var(--mo-ink-soft);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
}
body.ministeros-integrated #escandalo-pct { color: var(--mo-ink); font-size: 20px; font-weight: 700; }
/* La barra real la rellena game.js (#escandalo-bar width %); se pinta como
   relleno por tramos sobre un raíl neutro. */
body.ministeros-integrated #escandalo-bar-bg {
  height: 8px;
  border: 0;
  border-radius: 999px;
  background: var(--mo-gray-soft);
}
body.ministeros-integrated #escandalo-bar {
  height: 100%;
  border-radius: 999px;
  background: #35a76d;
  box-shadow: none;
  transition: width 0.3s ease, background-color 0.3s ease;
}
body.ministeros-integrated #escandalo-bar-bg[data-tramo="medio"] #escandalo-bar { background: #d49a2b; }
body.ministeros-integrated #escandalo-bar-bg[data-tramo="alto"] #escandalo-bar { background: #d5484f; }
body.ministeros-integrated #escandalo-bar-bg::after { display: none; }

/* ── 3 · Módulos (rejilla Gestión) ────────────────────────────────────── */
body.ministeros-integrated #modulos .modulo-btn {
  border: 0;
  background: none;
  box-shadow: none;
  font-family: var(--mo-font);
}
body.ministeros-integrated #modulos .modulo-nombre {
  color: var(--mo-ink);
  font-family: var(--mo-font);
  letter-spacing: 0;
  text-transform: none;
}
body.ministeros-integrated #modulos .modulo-btn.usado { opacity: 0.45; }

/* ── 4 · Dock: acciones restantes + pasar mes ─────────────────────────── */
body.ministeros-integrated #ministeros-dock-host { margin-left: 10px; }
body.ministeros-integrated #fin-turno-wrap {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
  padding: 8px 8px 8px 16px;
  border: 1px solid var(--mo-hairline);
  border-radius: 20px;
  background: var(--mo-surface-solid);
  box-shadow: var(--mo-card-shadow);
  animation: none;
}
body.ministeros-integrated #fin-turno-wrap::before { display: none; }
body.ministeros-integrated #fin-turno-label {
  margin: 0;
  color: var(--mo-ink-soft);
  font-family: var(--mo-font);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.04em;
  line-height: 1.2;
  max-width: 92px;
}
body.ministeros-integrated #acc-dots-big { margin: 0; font-size: 13px; letter-spacing: 2px; }
body.ministeros-integrated #acc-dots-big .dot-on { color: var(--mo-green); }
body.ministeros-integrated #acc-dots-big .dot-off { color: var(--mo-ink-faint); }
body.ministeros-integrated #fin-turno-btn {
  width: auto;
  margin: 0;
  padding: 11px 18px;
  border: 0;
  border-radius: 14px;
  background: var(--mo-green);
  box-shadow: 0 4px 12px rgba(19, 138, 98, 0.3);
  color: #fff;
  font-family: var(--mo-font);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0;
  text-shadow: none;
  white-space: nowrap;
  animation: none;
}
body.ministeros-integrated #fin-turno-btn:hover { background: #0f7a56; transform: none; }
body.ministeros-integrated #fin-turno-btn::after { content: "›"; position: static; display: inline-block; margin-left: 7px; transform: none; }

/* ── 5 · Panel de módulo (#modulo-modal real) ─────────────────────────── */
body.ministeros-integrated #modulo-modal {
  width: min(860px, calc(100% - 34px));
  max-width: none;
  max-height: min(600px, calc(100% - 20px));
  padding: 0;
  border: 1px solid var(--mo-glass-border);
  border-radius: var(--mo-panel-radius);
  background: var(--mo-surface);
  box-shadow: var(--mo-panel-shadow);
  color: var(--mo-ink);
  font-family: var(--mo-font);
  grid-template-rows: auto auto minmax(0, 1fr);
  animation: none;
}
body.ministeros-integrated #modulo-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0;
  padding: 18px 20px 14px;
  border: 0;
  border-bottom: 1px solid var(--mo-hairline);
}
body.ministeros-integrated #modulo-modal-titulo {
  color: var(--mo-ink);
  font-family: var(--mo-font);
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 0;
  text-shadow: none;
  text-transform: none;
}
body.ministeros-integrated #modulo-modal-cerrar {
  flex: none;
  width: 34px;
  height: 34px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: var(--mo-gray-soft) url("assets/icons/x.svg") center / 16px no-repeat;
  color: transparent;
  font-size: 0;
  cursor: pointer;
}
body.ministeros-integrated #modulo-modal-cerrar:hover { background-color: #dfe2e7; }
body.ministeros-integrated #aviso-dinero:not(.visible) { display: none; }
body.ministeros-integrated #aviso-dinero.visible {
  margin: 10px 18px 0;
  padding: 8px 12px;
  border: 0;
  border-radius: 12px;
  background: var(--mo-red-soft);
  color: #a52f3a;
  font-family: var(--mo-font);
  font-size: 12px;
}
body.ministeros-integrated #modulo-modal-acciones {
  display: grid;
  align-content: start;
  gap: 10px;
  padding: 14px 18px 18px;
  overflow: auto;
}

/* Fila de acción sobre la estructura real que genera abrirModulo():
   .accion-card > .accion-titulo-fila(.accion-nombre + .accion-badges) + .accion-desc */
body.ministeros-integrated .accion-card {
  display: grid;
  grid-template-columns: 10px minmax(0, 1fr) auto 14px;
  grid-template-rows: auto auto;
  align-items: center;
  column-gap: 11px;
  row-gap: 1px;
  min-height: 54px;
  padding: 8px 12px;
  border: 1px solid var(--mo-hairline);
  border-radius: var(--mo-row-radius);
  background: rgba(255, 255, 255, 0.66);
  box-shadow: var(--mo-card-shadow);
  color: var(--mo-ink);
  font-family: var(--mo-font);
  text-align: left;
  animation: none;
}
body.ministeros-integrated .accion-card:hover { border-color: rgba(19, 138, 98, 0.35); background: var(--mo-surface-solid); transform: none; }
body.ministeros-integrated .accion-card::before {
  content: "";
  grid-column: 1;
  grid-row: 1 / 3;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #3eb7a1;
}
body.ministeros-integrated .accion-card::after {
  content: "";
  grid-column: 4;
  grid-row: 1 / 3;
  width: 14px;
  height: 14px;
  background: url("assets/icons/chevron-right.svg") center / 14px no-repeat;
  opacity: 0.5;
}
body.ministeros-integrated #modulo-modal.cloaca-modal .accion-card::before { background: #4b515c; }
body.ministeros-integrated #modulo-modal.theone-modal .accion-card::before { background: #8a5a2b; }
body.ministeros-integrated #modulo-modal.covid-modal .accion-card::before { background: #1aa6b7; }
body.ministeros-integrated .accion-titulo-fila { display: contents; }
body.ministeros-integrated .accion-nombre {
  grid-column: 2;
  grid-row: 1;
  overflow: hidden;
  color: var(--mo-ink);
  font-size: 15px;
  font-weight: 700;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.ministeros-integrated .accion-desc {
  grid-column: 2;
  grid-row: 2;
  overflow: hidden;
  color: var(--mo-ink-soft);
  font-size: 12px;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.ministeros-integrated .accion-badges {
  grid-column: 3;
  grid-row: 1 / 3;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 5px;
  max-width: 300px;
}
body.ministeros-integrated .accion-card.bloqueada { opacity: 0.5; cursor: not-allowed; }

/* Badges (clases b-* de game.js; solo se reestilan) */
body.ministeros-integrated #ministeros-shell .badge {
  padding: 4px 8px;
  border: 0;
  border-radius: 999px;
  font-family: var(--mo-font);
  font-size: 11px;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.2;
}
body.ministeros-integrated #ministeros-shell .b-riesgo { background: var(--mo-red-soft); color: #c53543; }

/* ── 6 · Carta-llamada (#carta-modal real) ────────────────────────────── */
body.ministeros-integrated #carta-modal.mo-call-card {
  width: min(430px, calc(100% - 30px));
  max-height: calc(100% - 12px);
  overflow: hidden auto;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 26px;
  background: #11151d;
  box-shadow: var(--mo-panel-shadow);
  color: #f4f6fa;
  font-family: var(--mo-font);
}
body.ministeros-integrated #carta-modal.mo-call-card::before {
  content: "☎  LLAMADA ENTRANTE";
  display: block;
  padding: 11px 16px;
  background: #0b0e14;
  color: #f4f6fa;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
}
body.ministeros-integrated #carta-modal.mo-call-card .cr-opt { font-family: var(--mo-font); }
body.ministeros-integrated #carta-modal.mo-call-card .cr-oizq .cr-lbl::before,
body.ministeros-integrated #carta-modal.mo-call-card .cr-oder .cr-lbl::before {
  content: "";
  display: block;
  width: 38px;
  height: 38px;
  margin: 0 auto 7px;
  border-radius: 50%;
  background: #35b37c url("assets/icons/phone-call.svg") center / 18px no-repeat;
}
body.ministeros-integrated #carta-modal.mo-call-card .cr-oder .cr-lbl::before {
  background-color: #e0555c;
  background-image: url("assets/icons/phone-off.svg");
}
body.ministeros-integrated #carta-modal.mo-call-card .cr-lbl { display: block; }

/* ── 7 · Evento (#evento-modal real) → panel flotante claro ───────────── */
body.ministeros-integrated #evento-modal {
  width: min(780px, calc(100% - 34px));
  max-width: none;
  max-height: calc(100% - 16px);
  overflow: auto;
  padding: 22px 24px;
  border: 1px solid var(--mo-glass-border);
  border-radius: var(--mo-panel-radius);
  background: var(--mo-surface-solid);
  box-shadow: var(--mo-panel-shadow);
  color: var(--mo-ink);
  font-family: var(--mo-font);
  animation: none;
}
body.ministeros-integrated #evento-tipo {
  margin: 0 0 4px;
  color: var(--mo-ink-soft);
  font-family: var(--mo-font);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
}
body.ministeros-integrated #evento-tipo span { color: inherit !important; }
body.ministeros-integrated #evento-titulo {
  margin: 0 0 12px;
  color: var(--mo-ink);
  font-family: var(--mo-font);
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.2;
  text-shadow: none;
  text-transform: none;
}
body.ministeros-integrated #evento-retrato {
  height: clamp(120px, 24vh, 220px);
  margin: 0 0 14px;
  border: 0;
  border-radius: 16px;
  background: var(--mo-gray-soft);
}
body.ministeros-integrated #evento-texto {
  margin: 0 0 12px;
  padding: 2px 0 2px 14px;
  border: 0;
  border-left: 3px solid var(--mo-green);
  background: none;
  color: var(--mo-ink);
  font-family: var(--mo-font);
  font-size: 14px;
  line-height: 1.55;
}
body.ministeros-integrated #evento-recursos {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0 0 14px;
  padding: 0;
  border: 0;
  background: none;
}
body.ministeros-integrated .ev-recurso {
  padding: 4px 9px;
  border: 0;
  border-radius: 999px;
  background: var(--mo-gray-soft);
  color: var(--mo-ink-soft);
  font-family: var(--mo-font);
  font-size: 12px;
  font-weight: 600;
}
body.ministeros-integrated .ev-recurso span { color: var(--mo-ink); }
body.ministeros-integrated .ev-escandalo span { color: #c53543; }
body.ministeros-integrated #evento-opciones { display: grid; gap: 10px; }
body.ministeros-integrated .evento-opt-card {
  display: grid;
  gap: 6px;
  width: 100%;
  margin: 0;
  padding: 12px 14px;
  border: 1px solid var(--mo-hairline);
  border-radius: var(--mo-row-radius);
  background: rgba(255, 255, 255, 0.72);
  box-shadow: var(--mo-card-shadow);
  color: var(--mo-ink);
  font-family: var(--mo-font);
  text-align: left;
  cursor: pointer;
}
body.ministeros-integrated .evento-opt-card:hover { border-color: rgba(19, 138, 98, 0.35); background: #fff; transform: none; }
body.ministeros-integrated .evento-opt-titulo,
body.ministeros-integrated .evento-opt-card:hover .evento-opt-titulo {
  color: var(--mo-ink);
  font-family: var(--mo-font);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0;
}
body.ministeros-integrated .evento-opt-badges { display: flex; flex-wrap: wrap; gap: 5px; }

/* ── 8 · Mensajes: chat a doble panel (lista + conversación) ──────────── */
body.ministeros-integrated #ministeros-messages-host {
  position: relative;
  min-height: 0;
  height: 100%;
  overflow: hidden;
}
/* Modo chat: el JuanWei real queda en el DOM pero oculto (lo usa Icarus) */
body.ministeros-integrated #ministeros-messages-host[data-modo="chat"] > #movil-box { display: none; }
/* Modo teléfono: llamada/defensa de Icarus → se enseña el JuanWei */
body.ministeros-integrated #ministeros-messages-host[data-modo="telefono"] {
  display: grid;
  place-items: center;
  padding: 14px;
}
body.ministeros-integrated #ministeros-messages-host[data-modo="telefono"] > #ministeros-chat { display: none; }

body.ministeros-integrated #ministeros-chat { height: 100%; min-height: 0; }
body.ministeros-integrated #ministeros-chat .mo-chat-list { min-height: 0; display: flex; flex-direction: column; }
body.ministeros-integrated #ministeros-chat-lista { position: relative; overflow: auto; min-height: 0; flex: 1; }
body.ministeros-integrated #ministeros-chat .mo-search { flex: none; cursor: text; }
body.ministeros-integrated #ministeros-chat .mo-search input {
  width: 100%;
  min-width: 0;
  border: 0;
  outline: none;
  background: transparent;
  color: var(--mo-ink);
  font: inherit;
  font-size: 12px;
}
body.ministeros-integrated #ministeros-chat .mo-search input::placeholder { color: var(--mo-ink-faint); }
body.ministeros-integrated #ministeros-chat .mo-search__field:focus-within { box-shadow: 0 0 0 2px rgba(19, 138, 98, 0.35); }
body.ministeros-integrated #ministeros-chat .mo-chat-item { font-family: var(--mo-font); }
body.ministeros-integrated #ministeros-chat .mo-chat-item:hover { background: rgba(35, 159, 122, 0.07); }
body.ministeros-integrated #ministeros-chat .mo-chat-item.is-active { background: rgba(35, 159, 122, 0.14); }
body.ministeros-integrated #ministeros-chat .mo-chat-item:focus-visible { outline: 2px solid var(--mo-green); outline-offset: -2px; }
body.ministeros-integrated #ministeros-chat .mo-chat-item.is-registro { border-top: 6px solid var(--mo-hairline); }
body.ministeros-integrated #ministeros-chat .mo-avatar { flex: none; display: grid; place-items: center; }
body.ministeros-integrated #ministeros-chat .mo-avatar--emoji { font-size: 21px; line-height: 1; box-shadow: none; }
body.ministeros-integrated #ministeros-chat .mo-conversation { grid-template-rows: 64px minmax(0, 1fr); min-height: 0; }
body.ministeros-integrated #ministeros-chat .mo-conversation__head { font-family: var(--mo-font); }
body.ministeros-integrated #ministeros-chat .mo-conversation__head > span:last-child span { color: var(--mo-ink-faint); }
body.ministeros-integrated #ministeros-chat .mo-bubbles { min-height: 0; outline: none; }
body.ministeros-integrated #ministeros-chat .mo-bubble {
  color: var(--mo-ink);
  font-family: var(--mo-font);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
body.ministeros-integrated .mo-chat-empty {
  padding: 28px 18px;
  color: var(--mo-ink-soft);
  font-size: 13px;
  text-align: center;
}
body.ministeros-integrated .mo-chat-banner {
  justify-self: stretch;
  padding: 8px 12px;
  border-radius: 12px;
  background: var(--mo-red-soft);
  color: #a52f3a;
  font-size: 12px;
  font-weight: 600;
}
body.ministeros-integrated .mo-registro-entry {
  display: grid;
  gap: 3px;
  padding: 9px 12px;
  border: 1px solid var(--mo-hairline);
  border-radius: 12px;
  background: var(--mo-surface-solid);
  box-shadow: var(--mo-card-shadow);
  color: var(--mo-ink);
  font-size: 12.5px;
  line-height: 1.4;
  white-space: pre-wrap;
}
body.ministeros-integrated .mo-registro-entry__meta {
  color: var(--mo-ink-faint);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
body.ministeros-integrated .mo-registro-entry.bueno { border-left: 3px solid var(--mo-green); }
body.ministeros-integrated .mo-registro-entry.malo { border-left: 3px solid var(--mo-red); }

/* Avisos de fase: cada uno conserva su color (como en v1.1.26) */
body.ministeros-integrated #covid-aviso { border-color: rgba(26, 166, 183, 0.45) !important; background: #e3f6f8 !important; color: #0e6b77; }
body.ministeros-integrated #mundial-aviso { border-color: rgba(189, 124, 10, 0.45) !important; background: var(--mo-amber-soft) !important; color: #7a5208; }
body.ministeros-integrated #kitty-aviso { border-color: rgba(214, 64, 159, 0.4) !important; background: #fde8f4 !important; color: #9c2a6f; }
body.ministeros-integrated #vidaloca-aviso { border-color: rgba(213, 72, 79, 0.45) !important; background: var(--mo-red-soft) !important; color: #a52f3a; }
body.ministeros-integrated #ministeros-alert-host > [id$="-aviso"] b,
body.ministeros-integrated #ministeros-alert-host > [id$="-aviso"] span { color: inherit !important; }
[data-theme="dark"] body.ministeros-integrated #covid-aviso { background: #123a40 !important; color: #8fe3ee; }
[data-theme="dark"] body.ministeros-integrated #kitty-aviso { background: #43203a !important; color: #f7a8d6; }
[data-theme="dark"] body.ministeros-integrated #mundial-aviso { color: #f0c46a; }
[data-theme="dark"] body.ministeros-integrated #vidaloca-aviso { color: #f4a3a8; }

/* Badge de no leídos en el icono de Mensajes */
body.ministeros-integrated [data-open-panel="messages"] .mo-app__icon { position: relative; }
body.ministeros-integrated .mo-app__badge[hidden] { display: none; }

/* ── 9 · Tema oscuro ──────────────────────────────────────────────────── */
[data-theme="dark"] body.ministeros-integrated .accion-card,
[data-theme="dark"] body.ministeros-integrated .evento-opt-card { background: rgba(35, 41, 52, 0.7); }
[data-theme="dark"] body.ministeros-integrated #evento-modal { background: var(--mo-surface-solid); }
[data-theme="dark"] body.ministeros-integrated #reloj-mes-aviso,
[data-theme="dark"] body.ministeros-integrated #reloj-mes-aviso b { color: #f0c46a; }

/* Chat en tema oscuro (rediseno.css deja la lista con fondo claro) */
[data-theme="dark"] body.ministeros-integrated #ministeros-chat .mo-chat-list { background: rgba(18, 22, 30, 0.55); }
[data-theme="dark"] body.ministeros-integrated #ministeros-chat .mo-search__field { background: rgba(255, 255, 255, 0.07); }
[data-theme="dark"] body.ministeros-integrated #ministeros-chat .mo-chat-item.is-active { background: rgba(35, 159, 122, 0.22); }
[data-theme="dark"] body.ministeros-integrated #ministeros-chat .mo-bubble { background: #232a35; color: var(--mo-ink); }
[data-theme="dark"] body.ministeros-integrated .mo-registro-entry { background: #232a35; }

/* Carta-llamada: la cabecera «Llamada entrante» queda por encima del retrato
   (los hijos .cr-* van en position:absolute) y la etiqueta de ministerio baja. */
body.ministeros-integrated #carta-modal.mo-call-card::before { position: relative; z-index: 6; }
body.ministeros-integrated #carta-modal.mo-call-card .cr-min { top: 48px; }
/* Retrato a sangre: en el DOM real .cr-retrato ES la <img> (rediseno.css lo trataba
   como contenedor y la imagen salía pequeña y centrada). */
body.ministeros-integrated #carta-modal.mo-call-card .cr-portrait { display: block; inset: 38px 0 auto 0; height: 60%; }
body.ministeros-integrated #carta-modal.mo-call-card .cr-retrato {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 18%;
  background: #3b3f48;
}
body.ministeros-integrated #carta-modal.mo-call-card .cr-fallback[style*="flex"] { display: flex !important; }

/* ── 10 · App Ajustes (recupera Guardar / Créditos / Reiniciar del pie oculto) ── */
body.ministeros-integrated .mo-panel--settings {
  width: min(520px, calc(100% - 30px));
  height: auto;
  grid-template-rows: 80px auto;
}
body.ministeros-integrated .mo-settings { display: grid; gap: 8px; padding: 14px 18px 18px; }
body.ministeros-integrated .mo-setting {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--mo-hairline);
  border-radius: var(--mo-row-radius);
  background: rgba(255, 255, 255, 0.66);
  box-shadow: var(--mo-card-shadow);
  color: var(--mo-ink);
  font-family: var(--mo-font);
  text-align: left;
  cursor: pointer;
}
body.ministeros-integrated .mo-setting:hover,
body.ministeros-integrated .mo-setting:focus-visible { outline: none; border-color: rgba(19, 138, 98, 0.4); background: var(--mo-surface-solid); }
body.ministeros-integrated .mo-setting__icon {
  display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; background: var(--mo-gray-soft);
}
body.ministeros-integrated .mo-setting__icon .mo-icon { width: 18px; height: 18px; }
body.ministeros-integrated .mo-setting__copy strong { display: block; font-size: 14px; }
body.ministeros-integrated .mo-setting__copy span { display: block; margin-top: 1px; color: var(--mo-ink-soft); font-size: 12px; }
body.ministeros-integrated .mo-setting.is-danger strong { color: #c53543; }
body.ministeros-integrated .mo-setting.is-danger .mo-setting__icon { background: var(--mo-red-soft); }
body.ministeros-integrated .mo-settings__status:empty { display: none; }
body.ministeros-integrated #guardado-estado { color: var(--mo-green); font-family: var(--mo-font); font-size: 12px; text-align: center; }
[data-theme="dark"] body.ministeros-integrated .mo-setting { background: rgba(35, 41, 52, 0.7); }

/* ── 11 · Configurador en pantallas bajas (Steam Deck 1280×800) ──────────
   Antes los pasos Origen, Personalidad y Partida no cabían: Siguiente/Empezar
   quedaban bajo el borde y había que hacer scroll dentro de la caja. */
@media (max-height: 860px) {
  #config-inner { padding: 18px 22px; }
  #cfg-retrato { margin-bottom: 8px; gap: 4px; }
  .cfg-retrato-marco { width: 92px; height: 92px; border-width: 2px; }
  .cfg-emblema { width: 34px; height: 34px; bottom: 2px; }
  .cfg-opciones-lista { gap: 6px; margin-top: 6px; }
  .cfg-opcion-btn { padding: 8px 12px; }
  .cfg-opcion-nombre { margin-bottom: 1px; }
  .cfg-opcion-pista { font-size: 11px; }
  .cfg-atras-btn, .cfg-siguiente-btn { padding: 10px; }
  .config-dur-btn { padding-top: 10px; padding-bottom: 10px; }
  .config-dif-btn { padding-top: 8px; padding-bottom: 8px; }
  #config-resumen { margin-bottom: 10px; line-height: 1.6; }
  #config-btn-empezar { padding: 12px; }
  #cfg-modo-experto-btn { padding-top: 6px; padding-bottom: 6px; margin-top: 8px; margin-bottom: 8px; font-size: 12px; }
  .config-seccion { margin-bottom: 12px; }
  .config-seccion-label { margin-bottom: 6px; }
  .config-tagline { margin-bottom: 8px; }
  .config-dif-lista { gap: 6px; }
  .config-dur-grid { gap: 8px; }
}

/* ── 12. Notificación de mensaje con vista previa ─────────────────────────
   Foto del remitente + dos líneas del mensaje. Tocarla abre ese chat. */
.mo-toast .mo-toast__icon {
  margin-top: 0;
  overflow: hidden;
  display: grid;
}
.mo-toast.mo-toast--persona .mo-toast__icon {
  border-radius: 50%;
  background: #dfe3ea;
}
.mo-toast .mo-toast__photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 20%;
  filter: none;
}
.mo-toast .mo-toast__emoji {
  margin: 0;
  overflow: visible;
  color: inherit;
  font-size: 22px;
  line-height: 1;
}
.mo-toast .mo-toast__body { margin-top: 0; color: inherit; font-size: inherit; text-align: left; }
.mo-toast .mo-toast__msg {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  white-space: normal;
  line-height: 1.3;
  text-align: left;
}
.mo-toast.mo-toast--persona { min-height: 68px; background: rgba(250, 250, 252, 0.96); }
[data-theme="dark"] .mo-toast.mo-toast--persona { background: rgba(28, 31, 38, 0.96); color: #eef0f4; }
[data-theme="dark"] .mo-toast.mo-toast--persona .mo-toast__msg { color: #aab1bd; }

/* ── 13. Tamaño de letra (A+ / A++) dentro de la tablet ──────────────────
   styles.css amplía TODO #game con zoom (1,15 / 1,3). Con la carcasa eso
   agranda la tablet entera y la saca de la ventana. En modo integrado la
   tablet no se amplía: se amplían los paneles de lectura (módulo, carta,
   evento, KODiario, Mensajes, Ajustes, desbloqueo) y las notificaciones. */
body.ministeros-integrated.escala-grande #game,
body.ministeros-integrated.escala-muygrande #game { zoom: 1; }
body.ministeros-integrated { --mo-lectura-zoom: 1; }
body.ministeros-integrated.escala-grande { --mo-lectura-zoom: 1.15; }
body.ministeros-integrated.escala-muygrande { --mo-lectura-zoom: 1.3; }
body.ministeros-integrated #modulo-modal,
body.ministeros-integrated #carta-modal,
body.ministeros-integrated #evento-modal,
body.ministeros-integrated #kodiario-inner,
body.ministeros-integrated #desbloqueo-inner,
body.ministeros-integrated #ministeros-messages-overlay > .mo-panel,
body.ministeros-integrated #ministeros-settings-overlay > .mo-panel,
body.ministeros-integrated #ministeros-toast-stack {
  zoom: var(--mo-lectura-zoom);
}
/* Las notificaciones solo suben un punto: a A++ taparían media pantalla. */
body.ministeros-integrated.escala-muygrande #ministeros-toast-stack { zoom: 1.15; }
/* KODiario medía su alto con 100vh (styles.css): con la carcasa, y más aún
   ampliado, se salía por arriba y por abajo de la pantalla. Se ajusta a ella. */
body.ministeros-integrated #kodiario-inner {
  min-height: 0;
  max-height: calc(100% - 24px);
}
/* La carta también usaba 100vh: con A+/A++ se salía de la pantalla a 1280×800. */
body.ministeros-integrated #carta-modal.mo-call-card {
  height: min(560px, calc(100% - 12px));
}

/* ── 14. Arranque dentro de la tablet ────────────────────────────────────
   rediseno.js (módulo Arranque) mueve a .mo-screen la firma, el aviso de
   ficción, el configurador y la presentación. Aquí se les da el aspecto
   MinisterOS: pantalla de configuración de la tablet, con el retrato del
   ministro a la izquierda y los pasos a la derecha. Todo cabe a 1280×800. */
body.ministeros-integrated #aviso-legal-overlay,
body.ministeros-integrated #config-overlay,
body.ministeros-integrated #intro-overlay {
  position: absolute;
  inset: 44px 0 0;
  z-index: 90;
  padding: 16px 20px;
  background: linear-gradient(160deg, var(--mo-screen) 0 48%, var(--mo-screen-alt) 100%);
  color: var(--mo-ink);
  font-family: var(--mo-font);
}
/* Mismo orden de apilado que en styles.css: aviso > configurador > presentación */
body.ministeros-integrated #aviso-legal-overlay { z-index: 93; }
body.ministeros-integrated #config-overlay { z-index: 91; }
body.ministeros-integrated #firma-autor-overlay {
  position: absolute;
  inset: 0;
  z-index: 95;
  border-radius: inherit;
  background: #05070a;
}
body.ministeros-integrated #firma-autor-linea1 { font-family: var(--mo-font); font-weight: 600; letter-spacing: 6px; }
body.ministeros-integrated #firma-autor-linea2 {
  font-family: var(--mo-font);
  font-weight: 800;
  letter-spacing: 6px;
  color: #f4f6fa;
  text-shadow: none;
}

/* Tarjeta común (aviso, configurador, presentación) */
body.ministeros-integrated #aviso-legal-inner,
body.ministeros-integrated #config-inner,
body.ministeros-integrated #intro-inner {
  max-width: none;
  max-height: none;
  margin: 0;
  border: 1px solid var(--mo-glass-border);
  border-radius: var(--mo-panel-radius);
  background: var(--mo-surface-solid);
  box-shadow: var(--mo-panel-shadow);
  color: var(--mo-ink);
  font-family: var(--mo-font);
  text-align: left;
}

/* Aviso de ficción */
body.ministeros-integrated #aviso-legal-inner { width: min(660px, 100%); max-height: 100%; padding: 28px 32px; }
body.ministeros-integrated #aviso-legal-titulo { color: var(--mo-ink); font-size: 20px; letter-spacing: 0; text-align: left; margin-bottom: 14px; }
body.ministeros-integrated #aviso-legal-texto p { color: var(--mo-ink-soft); font-size: 14px; line-height: 1.6; }
body.ministeros-integrated #aviso-legal-btn {
  margin: 20px 0 0 auto;
  padding: 13px 26px;
  border-radius: 14px;
  background: var(--mo-green);
  color: #fff;
  font-family: inherit;
}

/* Configurador: retrato | paso */
body.ministeros-integrated #config-inner {
  display: grid;
  width: min(900px, 100%);
  height: min(620px, 100%);
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-rows: auto minmax(0, 1fr);
  grid-template-areas: "prog prog" "foto paso";
  padding: 22px 28px;
  overflow: hidden;
}
body.ministeros-integrated .mo-setup-progress { grid-area: prog; display: flex; gap: 6px; margin-bottom: 16px; }
body.ministeros-integrated .mo-setup-progress[hidden] { display: none; }
body.ministeros-integrated .mo-setup-progress span { flex: 1; height: 4px; border-radius: 2px; background: var(--mo-hairline); }
body.ministeros-integrated .mo-setup-progress span.is-on { background: var(--mo-green); }

body.ministeros-integrated #cfg-retrato {
  grid-area: foto;
  align-self: start;
  gap: 0;
  margin: 0 28px 0 0;
}
body.ministeros-integrated .cfg-retrato-marco {
  width: 230px;
  height: 290px;
  border: 0;
  border-radius: 24px;
  background: var(--mo-gray-soft);
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.18);
}
body.ministeros-integrated #cfg-retrato-img { object-position: center 18%; }
body.ministeros-integrated .cfg-emblema { width: 58px; height: 58px; bottom: -16px; }
body.ministeros-integrated #cfg-emblema-origen { left: 12px; }
body.ministeros-integrated #cfg-emblema-personalidad { right: 12px; }
body.ministeros-integrated .mo-setup-nombre {
  max-width: 230px;
  margin-top: 26px;
  color: var(--mo-ink);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.25;
  text-align: center;
  overflow-wrap: anywhere;
}

body.ministeros-integrated .cfg-paso { grid-area: paso; min-height: 0; animation: none; }
body.ministeros-integrated .cfg-paso.activo { display: flex; flex-direction: column; }
body.ministeros-integrated .cfg-paso > .config-seccion-label,
body.ministeros-integrated #cfg-paso-6 > .config-tagline {
  margin: 0;
  color: var(--mo-ink);
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
}

/* Paso 0: pantalla de título */
body.ministeros-integrated #cfg-paso-0.activo {
  width: min(560px, 100%);
  margin: 0 auto;
  justify-content: center;
  align-items: stretch;
  text-align: center;
}
body.ministeros-integrated .config-subtitulo { color: var(--mo-ink-faint); font-size: 11px; font-weight: 600; letter-spacing: 3px; }
body.ministeros-integrated .config-titulo {
  margin: 4px 0 0;
  color: var(--mo-ink);
  font-size: 44px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: none;
}
body.ministeros-integrated .cfg-bienvenida-texto { margin: 16px 0 26px; color: var(--mo-ink-soft); font-size: 15px; line-height: 1.6; }
body.ministeros-integrated .cfg-bienvenida-texto b { color: var(--mo-ink); }

/* Botones */
body.ministeros-integrated .cfg-continuar-btn,
body.ministeros-integrated .cfg-siguiente-btn,
body.ministeros-integrated #config-btn-empezar,
body.ministeros-integrated #intro-btn {
  border: 0;
  border-radius: 14px;
  background: var(--mo-green);
  color: #fff;
  font-family: inherit;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.3px;
  text-transform: none;
  box-shadow: none;
  animation: none;
  cursor: pointer;
}
body.ministeros-integrated .cfg-continuar-btn { margin: 0 0 10px; padding: 14px; }
body.ministeros-integrated #cfg-continuar-btn:not([hidden]) ~ .cfg-siguiente-btn { background: var(--mo-gray-soft); color: var(--mo-ink); }
body.ministeros-integrated .cfg-atras-btn {
  flex: 0 0 auto;
  min-width: 120px;
  border: 0;
  border-radius: 14px;
  background: var(--mo-gray-soft);
  color: var(--mo-ink);
  font-family: inherit;
}
body.ministeros-integrated .cfg-atras-btn,
body.ministeros-integrated .cfg-siguiente-btn { padding: 13px 18px; font-size: 15px; }
body.ministeros-integrated .cfg-nav { gap: 10px; margin-top: auto; padding-top: 14px; }
body.ministeros-integrated .cfg-continuar-btn:focus-visible,
body.ministeros-integrated .cfg-siguiente-btn:focus-visible,
body.ministeros-integrated .cfg-atras-btn:focus-visible,
body.ministeros-integrated .cfg-opcion-btn:focus-visible,
body.ministeros-integrated .config-dur-btn:focus-visible,
body.ministeros-integrated .config-dif-btn:focus-visible,
body.ministeros-integrated #cfg-modo-experto-btn:focus-visible,
body.ministeros-integrated #config-btn-empezar:focus-visible,
body.ministeros-integrated #intro-btn:focus-visible,
body.ministeros-integrated #aviso-legal-btn:focus-visible {
  outline: 3px solid var(--mo-blue);
  outline-offset: 2px;
}

/* Paso 1: nombre */
body.ministeros-integrated #cfg-paso-1.activo { width: min(560px, 100%); margin: 0 auto; justify-content: center; }
body.ministeros-integrated #cfg-paso-1 .cfg-nav { margin-top: 24px; }
body.ministeros-integrated .cfg-nombre-input {
  margin-top: 18px;
  padding: 14px 16px;
  border: 2px solid transparent;
  border-radius: 14px;
  background: var(--mo-gray-soft);
  color: var(--mo-ink);
  font-family: inherit;
  font-size: 20px;
  text-align: left;
}
body.ministeros-integrated .cfg-nombre-input:focus { border-color: var(--mo-green); }
body.ministeros-integrated .cfg-nota-paso { color: var(--mo-ink-soft); font-size: 13px; text-align: left; }

/* Pasos 2–5: opciones que genera game.js */
body.ministeros-integrated .cfg-opciones-lista {
  flex: 1 1 auto;
  min-height: 0;
  gap: 8px;
  margin-top: 14px;
  padding: 2px;
  overflow-y: auto;
}
body.ministeros-integrated .cfg-opcion-btn {
  padding: 10px 14px;
  border: 2px solid transparent;
  border-radius: var(--mo-row-radius);
  background: var(--mo-gray-soft);
  color: var(--mo-ink);
  font-family: inherit;
}
body.ministeros-integrated .cfg-opcion-btn:hover { border-color: var(--mo-hairline); }
body.ministeros-integrated .cfg-opcion-btn.activo { border-color: var(--mo-green); background: var(--mo-green-soft); color: var(--mo-ink); }
body.ministeros-integrated .cfg-opcion-nombre { margin-bottom: 2px; font-size: 14px; font-weight: 700; }
body.ministeros-integrated .cfg-opcion-pista,
body.ministeros-integrated .cfg-opcion-btn.activo .cfg-opcion-pista { color: var(--mo-ink-soft); font-size: 12px; font-style: normal; }
body.ministeros-integrated .cfg-opcion-efecto,
body.ministeros-integrated .cfg-opcion-btn.activo .cfg-opcion-efecto { margin-top: 3px; color: var(--mo-green); font-size: 12px; font-weight: 600; line-height: 1.4; }

/* Paso 6: partida */
body.ministeros-integrated #cfg-paso-6.activo {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-content: start;
  gap: 10px 12px;
  overflow-y: auto;
}
body.ministeros-integrated #cfg-paso-6 > * { grid-column: 1 / -1; margin: 0; }
body.ministeros-integrated #cfg-paso-6 > .cfg-nav { grid-column: 1; order: 1; margin: 0; padding: 0; }
body.ministeros-integrated #cfg-paso-6 > #config-btn-empezar { grid-column: 2; order: 2; }
body.ministeros-integrated #cfg-paso-6 > .config-nota { order: 3; }
body.ministeros-integrated .config-seccion { margin: 0; }
body.ministeros-integrated .config-seccion-label { margin-bottom: 6px; color: var(--mo-ink-faint); font-size: 11px; font-weight: 700; letter-spacing: 1.5px; }
body.ministeros-integrated .config-dur-grid,
body.ministeros-integrated .config-dif-lista { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
body.ministeros-integrated .config-dur-btn,
body.ministeros-integrated .config-dif-btn {
  padding: 10px 12px;
  border: 2px solid transparent;
  border-radius: var(--mo-row-radius);
  background: var(--mo-gray-soft);
  color: var(--mo-ink);
  font-family: inherit;
  font-size: 14px;
  letter-spacing: 0;
}
body.ministeros-integrated .config-dur-btn.activo,
body.ministeros-integrated .config-dif-btn.activo { border-color: var(--mo-green); background: var(--mo-green-soft); color: var(--mo-ink); }
body.ministeros-integrated .config-dur-sub { color: var(--mo-ink-soft); font-size: 11px; opacity: 1; }
body.ministeros-integrated .config-dif-btn { flex-direction: column-reverse; align-items: flex-start; justify-content: flex-end; gap: 4px; }
body.ministeros-integrated .config-dif-nombre,
body.ministeros-integrated .config-dif-btn.activo .config-dif-nombre { color: var(--mo-ink); font-size: 13px; }
body.ministeros-integrated .config-dif-desc,
body.ministeros-integrated .config-dif-btn.activo .config-dif-desc { color: var(--mo-ink-soft); font-size: 11px; line-height: 1.35; }
body.ministeros-integrated .config-dif-tag { color: var(--mo-ink-faint); font-size: 10px; font-weight: 700; }
body.ministeros-integrated .config-dif-btn.activo .config-dif-tag { color: var(--mo-green); }
body.ministeros-integrated #cfg-modo-experto-btn {
  padding: 10px 14px;
  border: 2px dashed var(--mo-hairline);
  border-radius: 14px;
  background: transparent;
  color: var(--mo-ink-soft);
  font-family: inherit;
  font-size: 13px;
  box-shadow: none;
  transform: none;
}
body.ministeros-integrated #cfg-modo-experto-btn.activo { border-style: solid; border-color: var(--mo-amber); background: var(--mo-amber-soft); color: var(--mo-ink); }
body.ministeros-integrated #config-resumen {
  padding: 10px 14px;
  border: 0;
  border-radius: 14px;
  background: var(--mo-gray-soft);
  color: var(--mo-ink-soft);
  font-size: 12px;
  line-height: 1.7;
}
body.ministeros-integrated #config-resumen #cfg-resumen-titulo { color: var(--mo-ink); font-weight: 700; }
body.ministeros-integrated #config-resumen span:not(#cfg-resumen-titulo) { color: var(--mo-ink); font-weight: 600; }
body.ministeros-integrated #config-btn-empezar { padding: 13px 22px; transform: none; }
body.ministeros-integrated .config-nota { color: var(--mo-ink-faint); font-size: 11px; letter-spacing: 0; text-align: right; }

/* Presentación y reglas */
body.ministeros-integrated #intro-inner {
  width: min(820px, 100%);
  height: min(640px, 100%);
  padding: 24px 30px 20px;
}
body.ministeros-integrated #intro-subtitulo { color: var(--mo-ink-faint); font-size: 11px; font-weight: 600; letter-spacing: 2px; }
body.ministeros-integrated #intro-titulo { margin-bottom: 12px; color: var(--mo-ink); font-size: 28px; letter-spacing: 0; text-transform: none; }
body.ministeros-integrated #intro-texto { color: var(--mo-ink-soft); font-size: 14px; line-height: 1.6; }
body.ministeros-integrated #intro-texto b { color: var(--mo-ink); }
body.ministeros-integrated .intro-regla { padding: 10px 14px; border: 0; border-radius: 14px; background: var(--mo-gray-soft); color: var(--mo-ink-soft); font-size: 13px; }
body.ministeros-integrated .intro-regla b,
body.ministeros-integrated .intro-recursos .ir b { color: var(--mo-ink); }
body.ministeros-integrated .intro-recursos .ir i,
body.ministeros-integrated .intro-consejo { color: var(--mo-ink-soft); }
body.ministeros-integrated #intro-btn { width: 100%; margin-top: 14px; padding: 14px 24px; font-size: 16px; }
body.ministeros-integrated #cfg-paso-0 .cfg-siguiente-btn,
body.ministeros-integrated #cfg-paso-0 .cfg-continuar-btn { flex: 0 0 auto; width: 100%; padding: 14px; }
[data-theme="dark"] body.ministeros-integrated .cfg-opcion-efecto,
[data-theme="dark"] body.ministeros-integrated .cfg-opcion-btn.activo .cfg-opcion-efecto,
[data-theme="dark"] body.ministeros-integrated .config-dif-btn.activo .config-dif-tag { color: #6fd6a8; }
/* Pantallas bajas (Steam Deck): las listas de 5 opciones caben sin scroll */
@media (max-height: 860px) {
  body.ministeros-integrated .cfg-opciones-lista { gap: 6px; margin-top: 10px; }
  body.ministeros-integrated .cfg-opcion-btn { padding: 8px 14px; }
  body.ministeros-integrated .cfg-opcion-efecto { margin-top: 2px; }
  body.ministeros-integrated .cfg-nav { padding-top: 10px; }
}


/* ── 15. KODiario como panel lateral editorial (estilo The Objective) ─────────
   [Rediseño KODiario · Claude, 26-sep-2026]
   El usuario pidió que el KODiario no ocupe toda la pantalla, sino que se abra
   en un lado como una noticia, y poder releer la edición del turno anterior.
   - Portada de cierre de mes (#kodiario-overlay): de tarjeta centrada a cajón
     lateral derecho. Mantiene su lógica de game.js (SALTAR = pasar de mes).
   - App Noticias (#ministeros-news-overlay, creada por rediseno.js): relectura
     de SOLO LECTURA de la hemeroteca, con la misma piel.
   Piel copiada de The Objective: blanco, grotesca del sistema, titular grande y
   ceñido, masthead serif, franja amarilla + punto coral, filetes finos. */

/* 15·fuentes. Playfair Display (SIL OFL, licencia en assets/fonts/OFL-PlayfairDisplay.txt)
   para el masthead y la opinión, como en The Objective. Incluida en el juego: no
   depende de internet (Steam). Inter ya la carga rediseno.css. */
@font-face { font-family: "Playfair Display"; src: url("assets/fonts/PlayfairDisplay-800.woff2") format("woff2"); font-style: normal; font-weight: 800; font-display: swap; }
@font-face { font-family: "Playfair Display"; src: url("assets/fonts/PlayfairDisplay-900.woff2") format("woff2"); font-style: normal; font-weight: 900; font-display: swap; }
@font-face { font-family: "Playfair Display"; src: url("assets/fonts/PlayfairDisplay-700-italic.woff2") format("woff2"); font-style: italic; font-weight: 700; font-display: swap; }

/* 15a. Colocación en cajón lateral derecho (portada + relectura) */
body.ministeros-integrated #kodiario-overlay,
body.ministeros-integrated #ministeros-news-overlay {
  place-items: stretch end;
  padding: 10px;
}
/* styles.css pone #kodiario-overlay.visible en display:flex centrado; place-items no
   actúa en flex, así que la portada se empuja a la derecha con justify-content. */
body.ministeros-integrated #kodiario-overlay {
  background: transparent;
  justify-content: flex-end;
  align-items: stretch;
}

/* 15b. Contenedores (portada = #kodiario-inner; relectura = .mo-panel--news-read) */
body.ministeros-integrated #kodiario-inner,
body.ministeros-integrated .mo-panel--news-read {
  width: min(460px, 66%);
  max-width: 460px;
  height: 100%;
  min-height: 0;
  max-height: 100%;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 18px;
  background: #fff;
  box-shadow: var(--mo-panel-shadow);
  color: #0a0a0a;
  font-family: var(--mo-font);
  overflow: hidden;
}
body.ministeros-integrated #kodiario-inner {
  display: block;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
body.ministeros-integrated .mo-panel--news-read {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  backdrop-filter: none;
}
body.ministeros-integrated .mo-news-scroll {
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  background: #fff;
}

/* 15c. Cabecera de la app Noticias (relectura) */
body.ministeros-integrated .mo-panel--news-read .mo-panel__header { border-bottom: 1px solid #ededed; }
body.ministeros-integrated .mo-news-nav { display: flex; align-items: center; gap: 6px; }
body.ministeros-integrated .mo-news-arrow {
  width: 30px; height: 30px; border-radius: 8px; border: 1px solid #e4e4e4; background: #fff;
  color: #0a0a0a; font-size: 16px; line-height: 1; cursor: pointer; display: grid; place-items: center;
}
body.ministeros-integrated .mo-news-arrow:hover:not(:disabled) { background: #0a0a0a; color: #fff; border-color: #0a0a0a; }
body.ministeros-integrated .mo-news-arrow:disabled { opacity: 0.3; cursor: default; }
body.ministeros-integrated .mo-news-ed { font-size: 11px; color: #6c6c6c; min-width: 56px; text-align: center; font-variant-numeric: tabular-nums; }

/* 15d. Piel editorial compartida (portada IDs + relectura clases) */
/* Franja amarilla */
body.ministeros-integrated #kodiario-franja,
body.ministeros-integrated .kr-strip {
  background: #f6e400; color: #111; padding: 7px 18px; display: flex; justify-content: space-between; gap: 10px;
  font-family: var(--mo-font); font-size: 10px; font-weight: 600; letter-spacing: 0.3px; text-transform: none;
}
/* Masthead */
body.ministeros-integrated #kodiario-head,
body.ministeros-integrated .kr-head { background: #fff; text-align: center; padding: 16px 18px 10px; border-bottom: 2px solid #111; }
body.ministeros-integrated #kodiario-titulo-wrap { border: 0; padding: 0; }
body.ministeros-integrated #kodiario-meta,
body.ministeros-integrated .kr-meta {
  display: flex; justify-content: center; gap: 12px; font-family: var(--mo-font); font-size: 9.5px;
  color: #6c6c6c; letter-spacing: 0.4px; text-transform: uppercase; margin-bottom: 8px;
}
body.ministeros-integrated #kodiario-nombre,
body.ministeros-integrated .kr-name {
  font-family: "Playfair Display", Georgia, "Times New Roman", serif; font-weight: 900; font-size: 42px; letter-spacing: -1px;
  color: #0a0a0a; line-height: 0.95;
}
body.ministeros-integrated #kodiario-lema,
body.ministeros-integrated .kr-lema {
  font-family: var(--mo-font); font-size: 9px; color: #6c6c6c; letter-spacing: 0.4px; text-transform: none; margin-top: 6px; font-style: normal;
}
/* Cuerpo */
body.ministeros-integrated #kodiario-body,
body.ministeros-integrated .kr-body { background: #fff; padding: 18px 20px 22px; }
/* Kicker (portada trae el punto en el texto; relectura usa .kr-dot) */
body.ministeros-integrated #kodiario-exclusiva,
body.ministeros-integrated .kr-kicker {
  display: flex; align-items: center; gap: 8px; font-family: var(--mo-font); font-size: 10.5px; font-weight: 700;
  letter-spacing: 0.6px; text-transform: uppercase; color: #0a0a0a; margin-bottom: 12px;
}
body.ministeros-integrated .kr-dot { width: 7px; height: 7px; border-radius: 50%; background: #ff5340; }
/* Titular grande y ceñido */
body.ministeros-integrated #kodiario-titular,
body.ministeros-integrated .kr-titular {
  font-family: var(--mo-font); font-size: 30px; font-weight: 600; line-height: 1.02; letter-spacing: -1px;
  color: #0a0a0a; border: 0; padding: 0; margin: 0 0 12px;
}
body.ministeros-integrated #kodiario-subtitular,
body.ministeros-integrated .kr-sub {
  font-family: var(--mo-font); font-size: 15px; font-weight: 400; font-style: normal; line-height: 1.35;
  color: #2a2a2a; margin: 0 0 18px;
}
/* Columnas "también hoy" en lista */
body.ministeros-integrated #kodiario-columnas { display: block; margin: 0; }
body.ministeros-integrated #kodiario-col1 { border-right: 0; padding-right: 0; }
body.ministeros-integrated #kodiario-col1,
body.ministeros-integrated #kodiario-col2,
body.ministeros-integrated .kr-item { border-top: 1px solid #e4e4e4; padding: 12px 0; }
body.ministeros-integrated .kodiario-col-label,
body.ministeros-integrated .kr-more-label {
  font-family: var(--mo-font); font-size: 10px; font-weight: 700; letter-spacing: 0.6px; text-transform: uppercase;
  color: #6c6c6c; margin-bottom: 6px;
}
body.ministeros-integrated #kodiario-noticia1,
body.ministeros-integrated #kodiario-noticia2,
body.ministeros-integrated .kr-item { font-family: var(--mo-font); font-size: 13px; line-height: 1.5; color: #2f2f2f; }
body.ministeros-integrated .kr-item { font-weight: 500; }
body.ministeros-integrated .kr-more-label { border: 0; padding: 14px 0 0; }
/* Separador oculto */
body.ministeros-integrated #kodiario-separador { display: none; }
/* Opinión */
body.ministeros-integrated #kodiario-opinion,
body.ministeros-integrated .kr-opinion {
  background: #fff; border: 0; border-top: 2px solid #111; padding: 16px 0 0; margin: 20px 0 8px;
}
body.ministeros-integrated .kr-op-label {
  font-family: var(--mo-font); font-size: 10px; font-weight: 700; letter-spacing: 0.6px; text-transform: uppercase; color: #ff5340; margin-bottom: 8px;
}
body.ministeros-integrated #kodiario-cita,
body.ministeros-integrated .kr-cita {
  font-family: "Playfair Display", Georgia, serif; font-style: italic; font-weight: 700; font-size: 18px; line-height: 1.25; color: #0a0a0a;
}
/* Texto ampliado (LEER MÁS) */
body.ministeros-integrated #kodiario-ampliado,
body.ministeros-integrated .kr-mas {
  background: #f4f4f4; border: 0; border-left: 3px solid #ff5340; padding: 12px 14px; font-family: var(--mo-font);
  font-size: 12.5px; font-style: normal; color: #333; line-height: 1.55; margin-top: 14px;
}
/* Botones de la portada (LEER MÁS / SALTAR) */
/* Botones fijos abajo: «pasar de mes» siempre visible sin hacer scroll (1280×800) */
body.ministeros-integrated #kodiario-botones {
  position: sticky; bottom: 0; z-index: 2; gap: 10px;
  margin: 18px -20px 0; padding: 12px 20px 14px;
  background: #fff; border-top: 1px solid #e4e4e4; box-shadow: 0 -10px 18px rgba(0, 0, 0, 0.06);
}
body.ministeros-integrated #kodiario-btn-mas {
  border-radius: 10px; border: 1px solid #e4e4e4; background: #fff; color: #0a0a0a; font-family: var(--mo-font); font-weight: 700;
}
body.ministeros-integrated #kodiario-btn-mas:hover { background: #f2f2f2; color: #0a0a0a; }
body.ministeros-integrated #kodiario-btn-saltar {
  border-radius: 10px; border: 0; background: #0a0a0a; color: #fff; font-family: var(--mo-font); font-weight: 700;
}
body.ministeros-integrated #kodiario-btn-saltar:hover { background: #000; }
/* Pie */
body.ministeros-integrated #kodiario-pie {
  background: #0a0a0a; color: #9a9a9a; font-family: var(--mo-font); font-size: 8px; letter-spacing: 0.5px;
}
/* Badge de la app Noticias (punto coral) */
body.ministeros-integrated [data-open-panel="news"] .mo-app__badge--dot {
  min-width: 10px; width: 10px; height: 10px; padding: 0; background: #ff5340;
}
/* Estado vacío de la relectura (Mes 1) */
body.ministeros-integrated .kr-empty {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; text-align: center;
  padding: 54px 30px; color: #6c6c6c; min-height: 100%;
}
body.ministeros-integrated .kr-empty__big { font-size: 38px; }
body.ministeros-integrated .kr-empty h4 { margin: 0; font-size: 15px; color: #0a0a0a; }
body.ministeros-integrated .kr-empty p { margin: 0; font-size: 13px; max-width: 240px; line-height: 1.5; }

/* Con el periódico abierto (portada o relectura) las notificaciones bajan a la
   zona libre de la izquierda para no tapar la cabecera del diario. */
#ministeros-shell:has(#kodiario-overlay.visible, #ministeros-news-overlay.visible) #ministeros-toast-stack {
  left: 18px;
  transform: none;
  width: min(380px, calc(100% - 520px));
}
body.escala-muygrande #ministeros-shell:has(#kodiario-overlay.visible, #ministeros-news-overlay.visible) #ministeros-toast-stack {
  width: min(340px, calc((100% - 640px) / 1.15));
}


/* ── 16. v1.1.29 · Iconos, notificaciones y desbloqueos ───────────────────
   [Claude, 3-oct-2026] Petición del usuario: menos iconos, globo de Mensajes
   sin recortar, notificaciones descartables (estilo iOS) y la pantalla de
   desbloqueo (módulos, Lady Díaz, Kitty) dentro de la tablet. */

/* 16a. El globo de no leídos se salía del icono y overflow:hidden lo recortaba.
   Los iconos de app solo llevan un glifo centrado, así que pueden desbordar. */
body.ministeros-integrated .mo-app-grid .mo-app__icon,
body.ministeros-integrated .mo-dock .mo-app__icon { overflow: visible; }

/* 16b. Apps que aún no existen en la partida (Icarus antes de su primer ataque) */
body.ministeros-integrated .mo-app.mo-app--pendiente { display: none; }

/* 16c. Notificaciones descartables: ✕ arriba a la izquierda (como en macOS/iOS)
   al pasar por encima — siempre visible en pantallas táctiles — o deslizando. */
.mo-toast-wrap {
  position: relative;
  pointer-events: auto;
  transition: transform 220ms var(--mo-ease), opacity 220ms ease;
  touch-action: pan-y;
}
.mo-toast-wrap.is-dragging { transition: none; }
.mo-toast-wrap .mo-toast { touch-action: pan-y; user-select: none; -webkit-user-select: none; }
.mo-toast__close {
  position: absolute; z-index: 2; top: -7px; left: -7px;
  display: grid; place-items: center; width: 22px; height: 22px; padding: 0;
  border: 1px solid rgba(0, 0, 0, 0.1); border-radius: 50%;
  background: rgba(246, 247, 249, 0.97); color: #3b414b;
  font: 600 15px/1 var(--mo-font); cursor: pointer;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
  opacity: 0; transform: scale(0.8);
  transition: opacity 140ms ease, transform 140ms ease;
}
.mo-toast-wrap:hover .mo-toast__close,
.mo-toast-wrap:focus-within .mo-toast__close { opacity: 1; transform: scale(1); }
.mo-toast__close:hover { background: #fff; color: #000; }
@media (hover: none) { .mo-toast__close { opacity: 1; transform: none; } }
[data-theme="dark"] .mo-toast__close { background: rgba(40, 44, 52, 0.97); color: #e9ecf1; border-color: rgba(255, 255, 255, 0.12); }

/* 16d. Desbloqueos dentro de la tablet, con aspecto MinisterOS.
   styles.css lo pintaba a pantalla completa (azul marino, amarillo, Courier). */
body.ministeros-integrated #desbloqueo-overlay {
  position: absolute; z-index: 82; inset: 44px 0 0;
  display: grid; place-items: center; padding: 16px;
  background: transparent;
  visibility: hidden; opacity: 0; pointer-events: none;
  transition: opacity 170ms ease, visibility 170ms ease;
}
body.ministeros-integrated #desbloqueo-overlay.visible { display: grid; visibility: visible; opacity: 1; pointer-events: auto; }
body.ministeros-integrated #desbloqueo-inner {
  width: min(520px, calc(100% - 24px)); max-width: none;
  max-height: calc(100% - 8px); margin: 0;
  padding: 20px 26px 18px; overflow-y: auto;
  border: 1px solid var(--mo-glass-border); border-radius: 26px;
  background: var(--mo-surface-solid); color: var(--mo-ink);
  box-shadow: var(--mo-panel-shadow);
  font-family: var(--mo-font); text-align: center;
  animation: mo-desbloqueo-in 260ms var(--mo-ease) both;
}
@keyframes mo-desbloqueo-in { from { opacity: 0; transform: translateY(10px) scale(0.97); } to { opacity: 1; transform: none; } }
/* Etiqueta superior según el tipo (la pone rediseno.js · Desbloqueo) */
body.ministeros-integrated #desbloqueo-inner::before {
  content: "MinisterOS · Aviso";
  display: inline-block; margin-bottom: 12px; padding: 4px 11px;
  border-radius: 999px; background: var(--mo-gray-soft); color: var(--mo-ink-soft);
  font-size: 10.5px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
}
body.ministeros-integrated #desbloqueo-inner[data-tipo="contacto"]::before { content: "● Nuevo contacto"; color: var(--mo-green); background: var(--mo-green-soft); }
body.ministeros-integrated #desbloqueo-inner[data-tipo="herramientas"]::before { content: "⬆ Actualización de MinisterOS"; color: var(--mo-blue); background: var(--mo-blue-soft); }
body.ministeros-integrated #desbloqueo-titulo {
  margin: 0 0 14px; color: var(--mo-ink);
  font-family: var(--mo-font); font-size: 19px; font-weight: 700; letter-spacing: 0.01em; text-transform: none;
}
/* Retrato: medallón circular con aro blanco */
body.ministeros-integrated #desbloqueo-inner .presentacion-retrato-full {
  width: 148px; max-width: 46%; height: auto; aspect-ratio: 1; object-fit: cover;
  margin: 0 auto 14px; border-radius: 50%;
  box-shadow: 0 0 0 4px #fff, 0 12px 28px rgba(0, 0, 0, 0.28);
  animation: mo-retrato-in 360ms var(--mo-ease) both;
}
@keyframes mo-retrato-in { from { opacity: 0; transform: scale(0.85); } to { opacity: 1; transform: none; } }
/* Su frase, como burbuja de chat del nuevo contacto */
body.ministeros-integrated #desbloqueo-inner .lady-dialogo,
body.ministeros-integrated #desbloqueo-inner .kitty-dialogo {
  margin: 0 0 12px; padding: 12px 15px;
  border-radius: 18px 18px 18px 6px; background: #e9ecf1; color: var(--mo-ink);
  font-family: var(--mo-font); font-size: 14px; font-style: normal; line-height: 1.45; text-align: left;
}
body.ministeros-integrated #desbloqueo-inner .lady-dialogo b { color: #c2410c; }
body.ministeros-integrated #desbloqueo-inner .kitty-dialogo b { color: #be185d; }
body.ministeros-integrated #desbloqueo-inner .lady-nota,
body.ministeros-integrated #desbloqueo-inner .kitty-nota {
  margin: 0; padding: 12px 2px 0; border: 0; border-top: 1px solid var(--mo-hairline);
  color: var(--mo-ink-soft); font-family: var(--mo-font); font-size: 12.5px; line-height: 1.5; text-align: left;
}
body.ministeros-integrated #desbloqueo-inner .kitty-nota b { color: var(--mo-ink); }
/* Lista de módulos desbloqueados */
body.ministeros-integrated #desbloqueo-inner .desbloqueo-intro { margin: 0 0 12px; color: var(--mo-ink-soft); font-size: 13.5px; font-style: normal; }
body.ministeros-integrated #desbloqueo-inner .desbloqueo-modulo {
  display: flex; align-items: center; gap: 12px; margin: 0 0 8px; padding: 10px 12px;
  border: 1px solid var(--mo-hairline); border-radius: 16px; background: #fff; text-align: left;
}
body.ministeros-integrated #desbloqueo-inner .desbloqueo-icono {
  display: grid; place-items: center; flex: 0 0 44px; height: 44px;
  border-radius: 12px; background: var(--mo-gray-soft); font-size: 22px;
}
body.ministeros-integrated #desbloqueo-inner .desbloqueo-nombre { margin: 0 0 2px; color: var(--mo-ink); font-family: var(--mo-font); font-size: 14.5px; font-weight: 700; }
body.ministeros-integrated #desbloqueo-inner .desbloqueo-ops {
  margin-left: 6px; padding: 2px 7px; border-radius: 999px; background: var(--mo-gray-soft);
  color: var(--mo-ink-soft); font-size: 10px; font-weight: 600; letter-spacing: 0; text-transform: none;
}
body.ministeros-integrated #desbloqueo-inner .desbloqueo-desc { color: var(--mo-ink-soft); font-size: 12.5px; line-height: 1.4; }
/* Botón: fijo abajo para que siempre se vea, también con texto A++ */
body.ministeros-integrated #desbloqueo-btn {
  position: sticky; bottom: 0; z-index: 1;
  display: block; width: 100%; margin: 16px 0 0; padding: 13px 18px;
  border: 0; border-radius: 14px; background: var(--mo-green); color: #fff;
  font: 700 15px/1 var(--mo-font); letter-spacing: 0; text-transform: none; cursor: pointer;
  box-shadow: 0 -14px 18px var(--mo-surface-solid);
  transition: filter 150ms ease, transform 120ms ease;
}
body.ministeros-integrated #desbloqueo-btn:hover { background: var(--mo-green); filter: brightness(1.08); transform: none; }
body.ministeros-integrated #desbloqueo-btn:active { transform: scale(0.98); }
@media (max-height: 820px) {
  body.ministeros-integrated #desbloqueo-inner .presentacion-retrato-full { width: 120px; }
}
[data-theme="dark"] body.ministeros-integrated #desbloqueo-inner .lady-dialogo,
[data-theme="dark"] body.ministeros-integrated #desbloqueo-inner .kitty-dialogo { background: rgba(255, 255, 255, 0.08); }
[data-theme="dark"] body.ministeros-integrated #desbloqueo-inner .desbloqueo-modulo { background: rgba(255, 255, 255, 0.04); }

/* La tarjeta de desbloqueo va por delante: mientras está abierta, las
   notificaciones pasan por detrás (siguen en Mensajes y en el globo). */
#ministeros-shell:has(#desbloqueo-overlay.visible) #ministeros-toast-stack { z-index: 81; }

/* ── 17 · v1.1.31 · Recursos dentro de los módulos + coste efectivo ──── */
body.ministeros-integrated #modulo-modal { grid-template-rows: auto auto auto minmax(0, 1fr); }
body.ministeros-integrated #modulo-modal-header { grid-row: 1; }
body.ministeros-integrated #modulo-recursos {
  grid-row: 2;
  display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-start;
  margin: 0; padding: 10px 18px 0; border: 0; background: none;
}
body.ministeros-integrated #aviso-dinero { grid-row: 3; }
body.ministeros-integrated #modulo-modal-acciones { grid-row: 4; }
body.ministeros-integrated .badge-nota { font-size: 0.85em; font-weight: 600; opacity: 0.7; margin-left: 2px; }
/* v1.1.32 · Las filas de acción crecen con sus etiquetas: antes la rejilla las aplastaba a
   54 px y, si las etiquetas ocupaban 2-3 líneas, se montaban sobre la tarjeta siguiente. */
body.ministeros-integrated #modulo-modal-acciones { grid-auto-rows: max-content; }

/* ── 18 · v1.1.33 · Saturación de módulos ─────────────────────────────── */
body.ministeros-integrated .aviso-saturacion-modulo {
  padding: 9px 12px; border-radius: 12px; background: #fff4e0; color: #8a5a00;
  font-family: var(--mo-font); font-size: 12.5px; line-height: 1.4;
}
.aviso-saturacion { color: #b07300; font-size: 0.92em; }

/* ── 19 · v1.1.34 · Móvil: tablet a pantalla completa en horizontal + aviso de giro ── */
body.mo-telefono #ministeros-stage {
  min-height: 0; height: 100vh; height: 100dvh; padding: 0; place-items: start;
}
body.mo-telefono,
html:has(body.mo-telefono) { overflow: hidden; }
body.mo-telefono #ministeros-shell {
  min-width: 0;
  aspect-ratio: auto; border: 0; border-radius: 0; box-shadow: none; background: var(--mo-screen, #eef1f5);
}
body.mo-telefono #ministeros-shell::before,
body.mo-telefono #ministeros-shell::after { display: none; }
body.mo-telefono #ministeros-shell .mo-screen {
  inset: 0; border: 0; border-radius: 0;
  padding-left: env(safe-area-inset-left, 0); padding-right: env(safe-area-inset-right, 0);
}
/* Sonido y tamaño de letra ya están en Ajustes: los botones flotantes estorban en un móvil */
body.mo-telefono #btn-mute,
body.mo-telefono #btn-escala { display: none !important; }

#mo-gira-movil { display: none; }
body.mo-telefono-vertical #mo-gira-movil {
  position: fixed; inset: 0; z-index: 10000;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px;
  padding: 32px 28px; background: #090c11; color: #eef1f5; text-align: center;
  font-family: var(--mo-font, system-ui, sans-serif);
}
#mo-gira-movil h2 { margin: 6px 0 0; font-size: 24px; font-weight: 800; letter-spacing: 0; }
#mo-gira-movil p { margin: 0; max-width: 300px; color: #b9c0cc; font-size: 15px; line-height: 1.45; }
#mo-gira-movil .mo-gira__nota { margin-top: 10px; font-size: 13px; color: #8f98a6; }
#mo-gira-movil .mo-gira__icono { font-size: 54px; animation: mo-gira 2.2s ease-in-out infinite; }
#mo-gira-movil button {
  margin-top: 14px; padding: 13px 20px; border: 0; border-radius: 14px;
  background: #138a62; color: #fff; font: 700 15px/1 var(--mo-font, system-ui, sans-serif); cursor: pointer;
}
@keyframes mo-gira { 0%, 25% { transform: rotate(0); } 55%, 85% { transform: rotate(-90deg); } 100% { transform: rotate(0); } }
@media (prefers-reduced-motion: reduce) { #mo-gira-movil .mo-gira__icono { animation: none; transform: rotate(-90deg); } }
body.mo-telefono-vertical #ministeros-stage { visibility: hidden; }
/* v1.1.34 · Ajustes tiene más opciones: el panel nunca pasa del alto de la pantalla y la lista se desplaza */
body.ministeros-integrated .mo-panel--settings {
  max-height: calc(100% - 24px);
  grid-template-rows: 80px minmax(0, 1fr);
}
body.ministeros-integrated .mo-panel--settings .mo-settings { overflow-y: auto; overscroll-behavior: contain; }

/* ── Home: Gestión y Aplicaciones como tarjetas separadas (aprobado por Edu, 2026-10-14) ──
   Antes los dos bloques no tenían contenedor y se leían como un único campo de iconos
   ("batiburrillo"). Les damos el lenguaje de superficie del dock para separarlos. */
body.ministeros-integrated .mo-appspace { gap: 28px; }
body.ministeros-integrated .mo-appspace > .mo-section {
  padding: 16px 18px 18px;
  border: 1px solid var(--mo-glass-border);
  border-radius: 22px;
  background: var(--mo-surface);
  box-shadow: var(--mo-card-shadow);
  -webkit-backdrop-filter: blur(24px) saturate(150%);
  backdrop-filter: blur(24px) saturate(150%);
}
/* Gestión ("tu trabajo") con un matiz cálido; Aplicaciones ("el sistema") en neutro.
   Fallback a --mo-surface si el navegador no soporta color-mix. */
body.ministeros-integrated .mo-appspace > .mo-section:first-child {
  background: var(--mo-surface);
  background: color-mix(in srgb, var(--mo-surface) 86%, #c9a24b 14%);
}
body.ministeros-integrated .mo-appspace .mo-section__title {
  height: auto;
  margin-bottom: 12px;
  font-size: 12px;
}

/* ── Móvil (compactar): que el home entero quepa en teléfono sin tocar tablet/desktop.
   Solo aplica con la clase .mo-telefono (la pone rediseno.js · Movil). Edu 2026-10-14. ── */
body.ministeros-integrated.mo-telefono .mo-home { gap: 8px; padding: 10px 14px; }
body.ministeros-integrated.mo-telefono .mo-homehead { min-height: 0; }
body.ministeros-integrated.mo-telefono .mo-homehead h1 { font-size: 20px; }
body.ministeros-integrated.mo-telefono .mo-resource-widget,
body.ministeros-integrated.mo-telefono #recursos { min-height: 0; }
body.ministeros-integrated.mo-telefono .recurso-card { padding: 8px 11px; }
body.ministeros-integrated.mo-telefono .recurso-val { font-size: 18px; }
body.ministeros-integrated.mo-telefono .mo-appspace { gap: 16px; }
body.ministeros-integrated.mo-telefono .mo-appspace > .mo-section { padding: 10px 12px 12px; }
body.ministeros-integrated.mo-telefono .mo-appspace .mo-section__title { margin-bottom: 8px; }
body.ministeros-integrated.mo-telefono #modulos { gap: 8px 12px; }
body.ministeros-integrated.mo-telefono .mo-app-grid { gap: 8px 10px; }
body.ministeros-integrated.mo-telefono .mo-app__icon,
body.ministeros-integrated.mo-telefono #modulos .modulo-icon { width: 60px; }
body.ministeros-integrated.mo-telefono .mo-app__label,
body.ministeros-integrated.mo-telefono #modulos .modulo-nombre { font-size: 10px; }
/* Móvil · segundo apriete para que entren LAS DOS filas de módulos a altura de teléfono */
body.ministeros-integrated.mo-telefono .mo-home { gap: 6px; padding: 8px 14px 6px; }
body.ministeros-integrated.mo-telefono .mo-homehead h1 { font-size: 18px; }
body.ministeros-integrated.mo-telefono .recurso-card { padding: 6px 10px; }
body.ministeros-integrated.mo-telefono .recurso-val { font-size: 16px; }
body.ministeros-integrated.mo-telefono .mo-app__icon,
body.ministeros-integrated.mo-telefono #modulos .modulo-icon { width: 54px; }
body.ministeros-integrated.mo-telefono #modulos { gap: 6px 12px; }
body.ministeros-integrated.mo-telefono .mo-dock { min-height: 54px; padding: 6px 16px; }
body.ministeros-integrated.mo-telefono .mo-dock .mo-app__icon { width: 48px; }
/* ── [v1.1.41 · Claude] Móvil: GESTIÓN a todo el ancho y los módulos en UNA fila.
   Con 5 columnas fijas la 2.ª fila no cabía en el alto del teléfono (faltaban ~33 px
   lógicos) y .mo-appspace (overflow: hidden) la recortaba sin aviso. APLICACIONES
   repite el dock, así que en móvil se oculta; Icarus pasa al dock (rediseno.js ·
   Movil.sync). Solo con .mo-telefono: tablet y escritorio no cambian. ── */
body.ministeros-integrated.mo-telefono .mo-appspace { grid-template-columns: minmax(0, 1fr); }
body.ministeros-integrated.mo-telefono .mo-appspace > .mo-device-column { display: none; }
body.ministeros-integrated.mo-telefono #modulos { grid-template-columns: repeat(auto-fit, minmax(80px, 1fr)); gap: 6px 8px; }
body.ministeros-integrated.mo-telefono #modulos .modulo-icon { width: 74px; }
body.ministeros-integrated.mo-telefono #modulos .modulo-nombre { font-size: 12px; }

/* ── [v1.1.43 · Claude] Icarus en su propia ventana de la tablet ─────────────
   El minijuego deja de vivir en el móvil JuanWei: rediseno.js mueve #icarus-panel a
   #ministeros-icarus-host. La capa oscura de pantalla completa ya no hace falta. ── */
body.ministeros-integrated.icarus-en-primer-plano::before { content: none; display: none; }
body.ministeros-integrated .mo-panel--icarus {
  width: min(940px, calc(100% - 30px));
  height: min(600px, calc(100% - 34px));
  grid-template-rows: 60px minmax(0, 1fr);
  overflow: hidden;
  background: #070c18;
  color: #eef4ff;
}
body.ministeros-integrated .mo-panel--icarus .mo-panel__header { background: #0b1222; border-bottom: 1px solid #ffffff14; }
body.ministeros-integrated .mo-panel--icarus .mo-panel__title h2 { color: #fff; }
body.ministeros-integrated .mo-panel--icarus .mo-panel__title p { color: #ff9ba2; }
body.ministeros-integrated #ministeros-icarus-overlay.visible .mo-panel--icarus { animation: icarusVibra .12s linear 8; }
#ministeros-icarus-host { position: relative; min-height: 0; overflow: hidden; }
/* Durante Icarus no salen notificaciones encima de la pista (los mensajes siguen en Mensajes). */
body.ministeros-integrated .icarus-abierto #ministeros-toast-stack { visibility: hidden; }
#ministeros-icarus-host #icarus-panel { position: absolute; inset: 0; }
#ministeros-icarus-host #icarus-alerta,
#ministeros-icarus-host #icarus-instrucciones,
#ministeros-icarus-host #icarus-resultado { padding-inline: max(20px, calc(50% - 250px)); }
#ministeros-icarus-host #icarus-alerta { padding-top: 24px; }
#ministeros-icarus-host #icarus-instrucciones { padding-top: 22px; }
#ministeros-icarus-host #icarus-juego { display: flex; flex-direction: column; height: 100%; padding: 12px 18px; }
#ministeros-icarus-host #icarus-juego[hidden] { display: none !important; }
#ministeros-icarus-host #icarus-juego-instruccion { margin: 6px 0 8px; font-size: 11px; }
#ministeros-icarus-host #icarus-pista { flex: 1 1 auto; height: auto; min-height: 150px; border-color: #1f4a60; background: #050a14; }
#ministeros-icarus-host #icarus-pista::after { content: none; }
#icarus-pista { touch-action: none; -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
#icarus-canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
#ministeros-icarus-host .icarus-juego-pie { margin-top: 8px; }
body.ministeros-integrated.mo-telefono .mo-panel--icarus { width: calc(100% - 16px); height: calc(100% - 16px); grid-template-rows: 46px minmax(0, 1fr); }
body.ministeros-integrated.mo-telefono #ministeros-icarus-host #icarus-juego { padding: 8px 14px; }
body.ministeros-integrated.mo-telefono #ministeros-icarus-host #icarus-juego-instruccion { display: none; }
body.ministeros-integrated.mo-telefono #ministeros-icarus-host #icarus-alerta { padding-top: 10px; }
body.ministeros-integrated.mo-telefono #ministeros-icarus-host #icarus-instrucciones { padding-top: 10px; }
#ministeros-icarus-host .icarus-alerta-avatar, #ministeros-icarus-host .icarus-instrucciones-icono { flex-shrink: 0; }
body.ministeros-integrated.mo-telefono .mo-panel--icarus .mo-panel__title h2 { font-size: 18px; line-height: 1.1; }
body.ministeros-integrated.mo-telefono .mo-panel--icarus .mo-panel__title p { font-size: 11px; }
body.ministeros-integrated.mo-telefono .mo-panel--icarus .mo-panel__appicon { width: 32px; height: 32px; }
body.ministeros-integrated.mo-telefono #ministeros-icarus-host .icarus-alerta-avatar { width: 64px; height: 64px; margin: 12px 0 8px; font-size: 26px; }
body.ministeros-integrated.mo-telefono #ministeros-icarus-host .icarus-alerta-mensaje { margin: 10px 4px auto; }
body.ministeros-integrated.mo-telefono #ministeros-icarus-host .icarus-alerta-botones { margin-top: 12px; }
body.ministeros-integrated.mo-telefono #ministeros-icarus-host .icarus-instrucciones-icono { width: 48px; height: 48px; margin-bottom: 8px; font-size: 24px; }
body.ministeros-integrated.mo-telefono #ministeros-icarus-host #icarus-instrucciones p { margin: 8px 0 6px; }
body.ministeros-integrated.mo-telefono #ministeros-icarus-host #icarus-instrucciones ul { margin-bottom: 8px; padding-block: 6px; line-height: 1.55; }
body.ministeros-integrated.mo-telefono #ministeros-icarus-host .icarus-controles { margin: 0 0 8px; }
@media (prefers-reduced-motion: reduce) {
  body.ministeros-integrated #ministeros-icarus-overlay.visible .mo-panel--icarus { animation: none; }
}

/* ── [v1.1.45] Mensajes · «Marcar todo como leído» ─────────────────────────── */
body.ministeros-integrated .mo-panel__actions { display: flex; flex: none; align-items: center; gap: 10px; }
body.ministeros-integrated .mo-chat-markall {
  display: inline-flex; align-items: center; gap: 7px; min-height: 34px; padding: 0 14px;
  border: 0; border-radius: 17px; background: rgba(19, 138, 98, 0.12); color: #0f7a57;
  font: inherit; font-size: 13px; font-weight: 600; white-space: nowrap; cursor: pointer;
}
body.ministeros-integrated .mo-chat-markall[hidden] { display: none; }
body.ministeros-integrated .mo-chat-markall .mo-icon { width: 17px; height: 17px; }
body.ministeros-integrated .mo-chat-markall:hover { background: rgba(19, 138, 98, 0.2); }
body.ministeros-integrated .mo-chat-markall:focus-visible { outline: 2px solid rgba(19, 138, 98, 0.45); outline-offset: 2px; }
body.ministeros-integrated .mo-chat-markall__corto { display: none; }
[data-theme="dark"] body.ministeros-integrated .mo-chat-markall { background: rgba(52, 199, 143, 0.16); color: #6fe0b3; }
[data-theme="dark"] body.ministeros-integrated .mo-chat-markall .mo-icon { filter: brightness(0) invert(0.85); }
/* En el móvil la cabecera es estrecha: texto corto y botón algo más alto para el dedo. */
body.ministeros-integrated.mo-telefono .mo-chat-markall { position: relative; min-height: 44px; padding: 0 14px; border-radius: 22px; font-size: 14px; }
/* Zona de toque invisible 8 px por cada lado: con el escalado del móvil (~0,73) queda en ~44 px reales. */
body.ministeros-integrated.mo-telefono .mo-chat-markall::before { content: ""; position: absolute; inset: -8px -6px; }
body.ministeros-integrated.mo-telefono .mo-chat-markall__largo { display: none; }
body.ministeros-integrated.mo-telefono .mo-chat-markall__corto { display: inline; }
body.ministeros-integrated #ministeros-messages-overlay .mo-panel__identity { flex: 1 1 auto; }

/* ── [v1.1.46] Reloj del mes en el dock ───────────────────────────────────── */
body.ministeros-integrated #reloj-mes-aviso { display: none !important; } /* sustituido por el reloj del dock */
.sr-solo { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
#reloj-dock[hidden] { display: none !important; }
#reloj-dock {
  --reloj-p: 1; --reloj-fg: #0f7a57; --reloj-bg: rgba(19, 138, 98, 0.12); --reloj-barra: #13a067;
  display: grid; justify-items: center; align-content: center; gap: 1px;
  min-width: 74px; padding: 5px 10px 6px; border-radius: 14px;
  background: var(--reloj-bg); color: var(--reloj-fg); font-family: var(--mo-font, inherit);
  transition: background-color .3s, color .3s;
}
#reloj-dock-label { font-size: 9px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; line-height: 1; }
#reloj-dock .reloj-dock-num { line-height: 1; font-variant-numeric: tabular-nums; }
#reloj-dock .reloj-dock-num b { font-size: 24px; font-weight: 800; }
#reloj-dock .reloj-dock-num small { font-size: 12px; font-weight: 700; margin-left: 1px; }
#reloj-dock .reloj-dock-barra { display: block; width: 100%; height: 4px; border-radius: 2px; background: rgba(0,0,0,.1); overflow: hidden; }
#reloj-dock .reloj-dock-barra i { display: block; height: 100%; width: calc(var(--reloj-p) * 100%); background: var(--reloj-barra); border-radius: 2px; transition: width 1s linear; }
#reloj-dock[data-modo="extra"] { --reloj-fg: #2c4fa8; --reloj-bg: rgba(53, 107, 215, 0.13); --reloj-barra: #356bd7; }
#reloj-dock[data-nivel="ambar"] { --reloj-fg: #8a5600; --reloj-bg: rgba(230, 160, 20, 0.2); --reloj-barra: #e0a014; }
#reloj-dock[data-nivel="rojo"] { --reloj-fg: #fff; --reloj-bg: #d6334a; --reloj-barra: #fff; animation: reloj-late 1s ease-in-out infinite; }
@keyframes reloj-late { 0%, 100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(214, 51, 74, .45); } 50% { transform: scale(1.06); box-shadow: 0 0 0 6px rgba(214, 51, 74, 0); } }
[data-theme="dark"] #reloj-dock { --reloj-fg: #6fe0b3; --reloj-bg: rgba(52, 199, 143, 0.16); }
[data-theme="dark"] #reloj-dock[data-modo="extra"] { --reloj-fg: #9db8ff; --reloj-bg: rgba(110, 150, 255, 0.18); }
[data-theme="dark"] #reloj-dock[data-nivel="ambar"] { --reloj-fg: #f3c35b; --reloj-bg: rgba(230, 160, 20, 0.22); }
[data-theme="dark"] #reloj-dock .reloj-dock-barra { background: rgba(255,255,255,.14); }
/* Penalización por inacción: «+N ⚠️» sube sobre la barra de escándalo */
#escandalo-wrap { position: relative; }
#escandalo-wrap .reloj-golpe {
  position: absolute; right: 12px; top: -6px; z-index: 5; pointer-events: none;
  padding: 3px 9px; border-radius: 10px; background: #d6334a; color: #fff; font-weight: 800; font-size: 15px;
  animation: reloj-golpe-sube 1.8s ease-out forwards;
}
@keyframes reloj-golpe-sube { 0% { opacity: 0; transform: translateY(10px) scale(.8); } 15% { opacity: 1; transform: none; } 80% { opacity: 1; } 100% { opacity: 0; transform: translateY(-18px); } }
#escandalo-wrap.escandalo-golpe { animation: escandalo-golpe .6s ease-in-out 2; }
@keyframes escandalo-golpe { 50% { box-shadow: 0 0 0 3px rgba(214, 51, 74, .55); } }

/* ── [v1.1.46] Módulos con candado (modo tutorial) ─────────────────────────── */
#modulos .modulo-btn.modulo-candado { position: relative; cursor: not-allowed; }
#modulos .modulo-btn.modulo-candado > * { filter: grayscale(1); opacity: .42; }
#modulos .modulo-btn.modulo-candado::after {
  content: "🔒 " attr(data-abre); position: absolute; top: 2px; left: 50%; transform: translateX(-50%);
  padding: 2px 7px; border-radius: 9px; background: rgba(20, 24, 32, .78); color: #fff;
  font-size: 10px; font-weight: 700; white-space: nowrap; pointer-events: none;
}
#modulos .modulo-btn.modulo-recien { animation: modulo-se-abre 1.2s ease-out 2; }
@keyframes modulo-se-abre { 0% { transform: scale(1); filter: drop-shadow(0 0 0 rgba(19,160,103,0)); } 40% { transform: scale(1.08); filter: drop-shadow(0 0 10px rgba(19,160,103,.8)); } 100% { transform: scale(1); filter: drop-shadow(0 0 0 rgba(19,160,103,0)); } }

/* ── [v1.1.46] KODiario: centrado cuando salta al cerrar el mes ─────────────
   La relectura desde la app Noticias sigue en el lateral (.mo-panel--news-read). */
body.ministeros-integrated #kodiario-overlay {
  justify-content: center; align-items: center; padding: 18px;
  background: rgba(10, 12, 18, 0.55);
  -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px);
}
body.ministeros-integrated #kodiario-inner {
  width: min(640px, 94%); max-width: 640px; height: auto; max-height: 100%;
  animation: ko-cae .45s cubic-bezier(.2, .9, .3, 1.2) both;
}
@keyframes ko-cae { from { transform: translateY(-24px) rotate(-1.5deg) scale(.96); opacity: 0; } to { transform: none; opacity: 1; } }

@media (prefers-reduced-motion: reduce) {
  #reloj-dock[data-nivel="rojo"], #modulos .modulo-btn.modulo-recien, #escandalo-wrap.escandalo-golpe,
  body.ministeros-integrated #kodiario-inner { animation: none; }
  #escandalo-wrap .reloj-golpe { animation-duration: .01s; animation-delay: 1.6s; }
  #modulos .modulo-btn.modulo-recien { outline: 3px solid #13a067; outline-offset: 2px; }
}

/* ── [v1.1.47] Carta swipe que entra como una llamada ─────────────────────────
   Se anima `rotate`/`translate` (propiedades sueltas) para no pisar el `transform`
   que usa el arrastre. Ráfagas de temblor como un móvil sonando; ≤ 3 destellos/s. */
#carta-modal.carta-llamando { animation: carta-suena 1.1s ease-in-out 3; }
/* La cabecera «☎ LLAMADA ENTRANTE» de la tablet se pone verde y parpadea mientras suena. */
body.ministeros-integrated #carta-modal.mo-call-card.carta-llamando::before { background: #13a067; animation: carta-aviso 1.1s ease-in-out 3; }
@keyframes carta-suena {
  0%, 46%, 100% { rotate: 0deg; translate: 0 0; }
  5% { rotate: -2.2deg; translate: -3px 0; } 10% { rotate: 2.2deg; translate: 3px 0; }
  15% { rotate: -2deg; translate: -3px 0; } 20% { rotate: 2deg; translate: 3px 0; }
  25% { rotate: -1.6deg; translate: -2px 0; } 30% { rotate: 1.6deg; translate: 2px 0; }
  35% { rotate: -1deg; translate: -1px 0; } 40% { rotate: 1deg; translate: 1px 0; }
}
@keyframes carta-aviso { 0%, 100% { opacity: 1; } 50% { opacity: .55; } }
@media (prefers-reduced-motion: reduce) {
  #carta-modal.carta-llamando { animation: none; box-shadow: 0 0 0 4px #13a067, 0 0 24px rgba(19, 160, 103, .6); }
  body.ministeros-integrated #carta-modal.mo-call-card.carta-llamando::before { animation: none; }
}