/* V189 · Legibilidad transversal para pestañas, mensajes y estados de módulos. */
:root {
  --module-ink-v189: #0b2545;
  --module-blue-v189: #0b3b6a;
  --module-blue-hover-v189: #164f83;
  --module-gold-v189: #ffd166;
  --module-line-v189: #91a8bb;
  --module-soft-v189: #eef4fb;
}

/* La ubicación entre módulos debe funcionar como navegación, no como decoración. */
#view .module-location-cyan { --location-accent:#056a72; --location-accent-2:#087f87; }
#view .module-location-gold { --location-accent:#704000; --location-accent-2:#9a5c00; }
#view .module-location-mint { --location-accent:#08685f; --location-accent-2:#087f72; }
#view .module-location-current > button,
#view .module-location-current > span {
  color:var(--module-ink-v189) !important;
  -webkit-text-fill-color:var(--module-ink-v189) !important;
}
#view .module-location-current > span {
  border:1px solid #a9bfd3 !important;
  background:#eaf2fb !important;
}
#view .module-location > nav > button {
  min-height:64px !important;
  border:2px solid var(--module-line-v189) !important;
  background:#fff !important;
  color:#314b66 !important;
  opacity:1 !important;
  box-shadow:0 5px 14px rgba(11,37,69,.08) !important;
}
#view .module-location > nav > button :is(span,small) {
  color:inherit !important;
  -webkit-text-fill-color:currentColor !important;
  opacity:1 !important;
}
#view .module-location > nav > button > b {
  border:1px solid #b8c9da !important;
  background:#e8f0f8 !important;
  color:#173b63 !important;
}
#view .module-location > nav > button.active {
  border-color:var(--module-gold-v189) !important;
  background:var(--module-blue-v189) !important;
  color:#fff !important;
  outline:3px solid rgba(255,209,102,.34) !important;
  box-shadow:0 10px 24px rgba(11,59,106,.25) !important;
}
#view .module-location > nav > button.active :is(span,small) {
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
}
#view .module-location > nav > button.active > b {
  border-color:#fff0b8 !important;
  background:var(--module-gold-v189) !important;
  color:#102c52 !important;
}
#view .module-location > nav > button.active::after {
  content:"ACTIVO";
  grid-column:2;
  justify-self:start;
  margin-top:2px;
  padding:2px 6px;
  border:1px solid #fff0b8;
  border-radius:999px;
  background:var(--module-gold-v189);
  color:#102c52;
  font-size:9px;
  font-weight:950;
  letter-spacing:.08em;
}

/* Estados activo/inactivo inequívocos en los controles superiores y subtareas. */
.work-mode-controls .mode-chip,
#view .module-one-tabs > button {
  min-height:42px !important;
  border:2px solid var(--module-line-v189) !important;
  background:#fff !important;
  color:var(--module-ink-v189) !important;
  -webkit-text-fill-color:var(--module-ink-v189) !important;
  opacity:1 !important;
}
.work-mode-controls .mode-chip.active,
.work-mode-controls .mode-chip[aria-pressed="true"],
#view .module-one-tabs > button.active {
  border-color:var(--module-gold-v189) !important;
  background:var(--module-blue-v189) !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  outline:2px solid rgba(255,209,102,.3) !important;
}
.work-mode-controls .mode-chip.active::after,
.work-mode-controls .mode-chip[aria-pressed="true"]::after,
#view .module-one-tabs > button.active::after {
  content:"ACTIVO";
  display:inline-block;
  margin-left:7px;
  padding:2px 5px;
  border:1px solid #fff0b8;
  border-radius:999px;
  background:var(--module-gold-v189);
  color:#102c52;
  font-size:8px;
  font-weight:950;
  letter-spacing:.06em;
  vertical-align:middle;
}
.work-mode-controls .mode-chip:hover,
#view .module-one-tabs > button:hover,
#view .module-location > nav > button:hover {
  border-color:var(--module-blue-hover-v189) !important;
}

/* Mensajes breves y etiquetas que antes quedaban demasiado pálidos. */
#view .experience-compass > div:not(.compass-context) .compass-kicker {
  color:#315d82 !important;
  -webkit-text-fill-color:#315d82 !important;
}
#view .experience-compass .compass-context .compass-kicker,
#view .experience-compass .compass-context .calm-status {
  color:#eef9ff !important;
  -webkit-text-fill-color:#eef9ff !important;
}
#view .mentor-score span { color:#eef9ff !important; }
#view .mentor-step { color:#334e68 !important; background:#f8fbff !important; }
#view .mentor-step > span {
  border:1px solid #b8c9da !important;
  background:#e3ecf5 !important;
  color:#334e68 !important;
}
#view .mentor-step.current {
  border-block:2px solid #c88a00 !important;
  background:#fff3cf !important;
  color:#563900 !important;
}
#view .mentor-step.current > span { background:#7a4e00 !important; color:#fff !important; }
#view .mentor-route-grid button > span { color:#684600 !important; }
#view .counter-purpose {
  color:#294d70 !important;
  -webkit-text-fill-color:#294d70 !important;
  font-weight:750 !important;
}

/* Ninguna pestaña importante se corta ni depende de puntos suspensivos. */
#view :is(.section-tab,.tab,.primary-tab,.menu-child,.nav-subitem,.ux-space-tab),
.work-mode-controls .mode-chip,
#view .module-one-tabs > button,
#view .module-location > nav > button {
  white-space:normal !important;
  overflow:visible !important;
  text-overflow:clip !important;
  overflow-wrap:anywhere !important;
  line-height:1.3 !important;
}
#view :is(.section-tab,.tab,.primary-tab,.menu-child,.nav-subitem,.ux-space-tab),
.work-mode-controls .mode-chip,
#view .module-one-tabs > button {
  text-align:center !important;
}

/* Foco visible y lectura estable en escritorio y móvil. */
#view :is(.module-location button,.module-one-tabs button,.section-tab,.tab,.mentor-route-grid button):focus-visible,
.work-mode-controls .mode-chip:focus-visible {
  outline:4px solid var(--module-gold-v189) !important;
  outline-offset:2px !important;
}

@media (max-width:680px) {
  #view .module-location > nav { gap:11px !important; }
  #view .module-location > nav > button { min-height:70px !important; }
  .work-mode-controls { align-items:stretch !important; flex-wrap:wrap !important; gap:8px !important; }
  .work-mode-controls .mode-chip { flex:1 1 135px !important; white-space:normal !important; }
}

@media (prefers-reduced-motion:reduce) {
  #view .module-location button,
  #view .module-one-tabs button,
  .work-mode-controls .mode-chip { transition:none !important; }
}
